
<!doctype html>
<html lang="en" class="no-js">
  <head>
    
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width,initial-scale=1">
      
        <meta name="description" content="DrissionPage是个网页自动化工具。既能控制浏览器，也能收发数据包。可兼顾便利性和高效率。功能强大，语法简洁优雅。">
      
      
        <meta name="author" content="g1879">
      
      
        <link rel="canonical" href="http://g1879.gitee.io/DrissionPageDocs/SessionPge/find_elements/">
      
      
        <link rel="prev" href="../get_page_info/">
      
      
        <link rel="next" href="../get_element_info/">
      
      <link rel="icon" href="../../imgs/logo.png">
      <meta name="generator" content="mkdocs-1.4.3, mkdocs-material-9.1.16">
    
    
      
        <title>✉️ 查找元素 - DrissionPage</title>
      
    
    
      <link rel="stylesheet" href="../../assets/stylesheets/main.26e3688c.min.css">
      
        
        <link rel="stylesheet" href="../../assets/stylesheets/palette.ecc896b0.min.css">
      
      
  
  
    
    
  
    
    
  
    
    
  
    
    
  
    
    
  
    
    
  
    
    
  
    
    
  
    
    
  
    
    
  
    
    
  
    
    
  
  
  <style>:root{--md-admonition-icon--note:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"/></svg>');--md-admonition-icon--abstract:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M2.5 1.75v11.5c0 .138.112.25.25.25h3.17a.75.75 0 0 1 0 1.5H2.75A1.75 1.75 0 0 1 1 13.25V1.75C1 .784 1.784 0 2.75 0h8.5C12.216 0 13 .784 13 1.75v7.736a.75.75 0 0 1-1.5 0V1.75a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25Zm13.274 9.537v-.001l-4.557 4.45a.75.75 0 0 1-1.055-.008l-1.943-1.95a.75.75 0 0 1 1.062-1.058l1.419 1.425 4.026-3.932a.75.75 0 1 1 1.048 1.074ZM4.75 4h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5ZM4 7.75A.75.75 0 0 1 4.75 7h2a.75.75 0 0 1 0 1.5h-2A.75.75 0 0 1 4 7.75Z"/></svg>');--md-admonition-icon--info:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75ZM8 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"/></svg>');--md-admonition-icon--tip:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M3.499.75a.75.75 0 0 1 1.5 0v.996C5.9 2.903 6.793 3.65 7.662 4.376l.24.202c-.036-.694.055-1.422.426-2.163C9.1.873 10.794-.045 12.622.26 14.408.558 16 1.94 16 4.25c0 1.278-.954 2.575-2.44 2.734l.146.508.065.22c.203.701.412 1.455.476 2.226.142 1.707-.4 3.03-1.487 3.898C11.714 14.671 10.27 15 8.75 15h-6a.75.75 0 0 1 0-1.5h1.376a4.484 4.484 0 0 1-.563-1.191 3.835 3.835 0 0 1-.05-2.063 4.647 4.647 0 0 1-2.025-.293.75.75 0 0 1 .525-1.406c1.357.507 2.376-.006 2.698-.318l.009-.01a.747.747 0 0 1 1.06 0 .748.748 0 0 1-.012 1.074c-.912.92-.992 1.835-.768 2.586.221.74.745 1.337 1.196 1.621H8.75c1.343 0 2.398-.296 3.074-.836.635-.507 1.036-1.31.928-2.602-.05-.603-.216-1.224-.422-1.93l-.064-.221c-.12-.407-.246-.84-.353-1.29a2.425 2.425 0 0 1-.507-.441 3.075 3.075 0 0 1-.633-1.248.75.75 0 0 1 1.455-.364c.046.185.144.436.31.627.146.168.353.305.712.305.738 0 1.25-.615 1.25-1.25 0-1.47-.95-2.315-2.123-2.51-1.172-.196-2.227.387-2.706 1.345-.46.92-.27 1.774.019 3.062l.042.19a.884.884 0 0 1 .01.05c.348.443.666.949.94 1.553a.75.75 0 1 1-1.365.62c-.553-1.217-1.32-1.94-2.3-2.768L6.7 5.527c-.814-.68-1.75-1.462-2.692-2.619a3.737 3.737 0 0 0-1.023.88c-.406.495-.663 1.036-.722 1.508.116.122.306.21.591.239.388.038.797-.06 1.032-.19a.75.75 0 0 1 .728 1.31c-.515.287-1.23.439-1.906.373-.682-.067-1.473-.38-1.879-1.193L.75 5.677V5.5c0-.984.48-1.94 1.077-2.664.46-.559 1.05-1.055 1.673-1.353V.75Z"/></svg>');--md-admonition-icon--success:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"/></svg>');--md-admonition-icon--question:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.92 6.085h.001a.749.749 0 1 1-1.342-.67c.169-.339.436-.701.849-.977C6.845 4.16 7.369 4 8 4a2.756 2.756 0 0 1 1.637.525c.503.377.863.965.863 1.725 0 .448-.115.83-.329 1.15-.205.307-.47.513-.692.662-.109.072-.22.138-.313.195l-.006.004a6.24 6.24 0 0 0-.26.16.952.952 0 0 0-.276.245.75.75 0 0 1-1.248-.832c.184-.264.42-.489.692-.661.103-.067.207-.132.313-.195l.007-.004c.1-.061.182-.11.258-.161a.969.969 0 0 0 .277-.245C8.96 6.514 9 6.427 9 6.25a.612.612 0 0 0-.262-.525A1.27 1.27 0 0 0 8 5.5c-.369 0-.595.09-.74.187a1.01 1.01 0 0 0-.34.398ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"/></svg>');--md-admonition-icon--warning:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"/></svg>');--md-admonition-icon--failure:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M2.344 2.343h-.001a8 8 0 0 1 11.314 11.314A8.002 8.002 0 0 1 .234 10.089a8 8 0 0 1 2.11-7.746Zm1.06 10.253a6.5 6.5 0 1 0 9.108-9.275 6.5 6.5 0 0 0-9.108 9.275ZM6.03 4.97 8 6.94l1.97-1.97a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l1.97 1.97a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-1.97 1.97a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L6.94 8 4.97 6.03a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018Z"/></svg>');--md-admonition-icon--danger:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M9.504.43a1.516 1.516 0 0 1 2.437 1.713L10.415 5.5h2.123c1.57 0 2.346 1.909 1.22 3.004l-7.34 7.142a1.249 1.249 0 0 1-.871.354h-.302a1.25 1.25 0 0 1-1.157-1.723L5.633 10.5H3.462c-1.57 0-2.346-1.909-1.22-3.004L9.503.429Zm1.047 1.074L3.286 8.571A.25.25 0 0 0 3.462 9H6.75a.75.75 0 0 1 .694 1.034l-1.713 4.188 6.982-6.793A.25.25 0 0 0 12.538 7H9.25a.75.75 0 0 1-.683-1.06l2.008-4.418.003-.006a.036.036 0 0 0-.004-.009l-.006-.006-.008-.001c-.003 0-.006.002-.009.004Z"/></svg>');--md-admonition-icon--bug:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M4.72.22a.75.75 0 0 1 1.06 0l1 .999a3.488 3.488 0 0 1 2.441 0l.999-1a.748.748 0 0 1 1.265.332.75.75 0 0 1-.205.729l-.775.776c.616.63.995 1.493.995 2.444v.327c0 .1-.009.197-.025.292.408.14.764.392 1.029.722l1.968-.787a.75.75 0 0 1 .556 1.392L13 7.258V9h2.25a.75.75 0 0 1 0 1.5H13v.5c0 .409-.049.806-.141 1.186l2.17.868a.75.75 0 0 1-.557 1.392l-2.184-.873A4.997 4.997 0 0 1 8 16a4.997 4.997 0 0 1-4.288-2.427l-2.183.873a.75.75 0 0 1-.558-1.392l2.17-.868A5.036 5.036 0 0 1 3 11v-.5H.75a.75.75 0 0 1 0-1.5H3V7.258L.971 6.446a.75.75 0 0 1 .558-1.392l1.967.787c.265-.33.62-.583 1.03-.722a1.677 1.677 0 0 1-.026-.292V4.5c0-.951.38-1.814.995-2.444L4.72 1.28a.75.75 0 0 1 0-1.06Zm.53 6.28a.75.75 0 0 0-.75.75V11a3.5 3.5 0 1 0 7 0V7.25a.75.75 0 0 0-.75-.75ZM6.173 5h3.654A.172.172 0 0 0 10 4.827V4.5a2 2 0 1 0-4 0v.327c0 .096.077.173.173.173Z"/></svg>');--md-admonition-icon--example:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M5 5.782V2.5h-.25a.75.75 0 0 1 0-1.5h6.5a.75.75 0 0 1 0 1.5H11v3.282l3.666 5.76C15.619 13.04 14.543 15 12.767 15H3.233c-1.776 0-2.852-1.96-1.899-3.458Zm-2.4 6.565a.75.75 0 0 0 .633 1.153h9.534a.75.75 0 0 0 .633-1.153L12.225 10.5h-8.45ZM9.5 2.5h-3V6c0 .143-.04.283-.117.403L4.73 9h6.54L9.617 6.403A.746.746 0 0 1 9.5 6Z"/></svg>');--md-admonition-icon--quote:url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M1.75 2.5h10.5a.75.75 0 0 1 0 1.5H1.75a.75.75 0 0 1 0-1.5Zm4 5h8.5a.75.75 0 0 1 0 1.5h-8.5a.75.75 0 0 1 0-1.5Zm0 5h8.5a.75.75 0 0 1 0 1.5h-8.5a.75.75 0 0 1 0-1.5ZM2.5 7.75v6a.75.75 0 0 1-1.5 0v-6a.75.75 0 0 1 1.5 0Z"/></svg>');}</style>


    
    
    
      
        
        
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,700,700i%7CRoboto+Mono:400,400i,700,700i&display=fallback">
        <style>:root{--md-text-font:"Roboto";--md-code-font:"Roboto Mono"}</style>
      
    
    
    <script>__md_scope=new URL("../..",location),__md_hash=e=>[...e].reduce((e,_)=>(e<<5)-e+_.charCodeAt(0),0),__md_get=(e,_=localStorage,t=__md_scope)=>JSON.parse(_.getItem(t.pathname+"."+e)),__md_set=(e,_,t=localStorage,a=__md_scope)=>{try{t.setItem(a.pathname+"."+e,JSON.stringify(_))}catch(e){}}</script>
    
      

    
    
    
  </head>
  
  
    
    
      
    
    
    
    
    <body dir="ltr" data-md-color-scheme="slate" data-md-color-primary="indigo" data-md-color-accent="indigo">
  
    
    
      <script>var palette=__md_get("__palette");if(palette&&"object"==typeof palette.color)for(var key of Object.keys(palette.color))document.body.setAttribute("data-md-color-"+key,palette.color[key])</script>
    
    <input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
    <input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
    <label class="md-overlay" for="__drawer"></label>
    <div data-md-component="skip">
      
        
        <a href="#_1" class="md-skip">
          Skip to content
        </a>
      
    </div>
    <div data-md-component="announce">
      
    </div>
    
    
      

  

<header class="md-header md-header--shadow md-header--lifted" data-md-component="header">
  <nav class="md-header__inner md-grid" aria-label="Header">
    <a href="../.." title="DrissionPage" class="md-header__button md-logo" aria-label="DrissionPage" data-md-component="logo">
      
  <img src="../../imgs/logo.png" alt="logo">

    </a>
    <label class="md-header__button md-icon" for="__drawer">
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 6h18v2H3V6m0 5h18v2H3v-2m0 5h18v2H3v-2Z"/></svg>
    </label>
    <div class="md-header__title" data-md-component="header-title">
      <div class="md-header__ellipsis">
        <div class="md-header__topic">
          <span class="md-ellipsis">
            DrissionPage
          </span>
        </div>
        <div class="md-header__topic" data-md-component="header-topic">
          <span class="md-ellipsis">
            
              ✉️ 查找元素
            
          </span>
        </div>
      </div>
    </div>
    
      
        <form class="md-header__option" data-md-component="palette">
          
            
            
            
            <input class="md-option" data-md-color-media="(prefers-color-scheme: light)" data-md-color-scheme="slate" data-md-color-primary="indigo" data-md-color-accent="indigo"  aria-label="Switch to dark mode"  type="radio" name="__palette" id="__palette_1">
            
              <label class="md-header__button md-icon" title="Switch to dark mode" for="__palette_2" hidden>
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 8a4 4 0 0 0-4 4 4 4 0 0 0 4 4 4 4 0 0 0 4-4 4 4 0 0 0-4-4m0 10a6 6 0 0 1-6-6 6 6 0 0 1 6-6 6 6 0 0 1 6 6 6 6 0 0 1-6 6m8-9.31V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12 20 8.69Z"/></svg>
              </label>
            
          
            
            
            
            <input class="md-option" data-md-color-media="(prefers-color-scheme: dark)" data-md-color-scheme="default" data-md-color-primary="indigo" data-md-color-accent="indigo"  aria-label="Switch to light mode"  type="radio" name="__palette" id="__palette_2">
            
              <label class="md-header__button md-icon" title="Switch to light mode" for="__palette_1" hidden>
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 18c-.89 0-1.74-.2-2.5-.55C11.56 16.5 13 14.42 13 12c0-2.42-1.44-4.5-3.5-5.45C10.26 6.2 11.11 6 12 6a6 6 0 0 1 6 6 6 6 0 0 1-6 6m8-9.31V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12 20 8.69Z"/></svg>
              </label>
            
          
        </form>
      
    
    
    
      <label class="md-header__button md-icon" for="__search">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5Z"/></svg>
      </label>
      <div class="md-search" data-md-component="search" role="dialog">
  <label class="md-search__overlay" for="__search"></label>
  <div class="md-search__inner" role="search">
    <form class="md-search__form" name="search">
      <input type="text" class="md-search__input" name="query" aria-label="Search" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="search-query" required>
      <label class="md-search__icon md-icon" for="__search">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.516 6.516 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5Z"/></svg>
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12Z"/></svg>
      </label>
      <nav class="md-search__options" aria-label="Search">
        
        <button type="reset" class="md-search__icon md-icon" title="Clear" aria-label="Clear" tabindex="-1">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41Z"/></svg>
        </button>
      </nav>
      
    </form>
    <div class="md-search__output">
      <div class="md-search__scrollwrap" data-md-scrollfix>
        <div class="md-search-result" data-md-component="search-result">
          <div class="md-search-result__meta">
            Initializing search
          </div>
          <ol class="md-search-result__list" role="presentation"></ol>
        </div>
      </div>
    </div>
  </div>
</div>
    
    
      <div class="md-header__source">
        <a href="https://gitee.com/g1879/DrissionPage" title="Go to repository" class="md-source" data-md-component="source">
  <div class="md-source__icon md-icon">
    
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2023 Fonticons, Inc.--><path d="M439.55 236.05 244 40.45a28.87 28.87 0 0 0-40.81 0l-40.66 40.63 51.52 51.52c27.06-9.14 52.68 16.77 43.39 43.68l49.66 49.66c34.23-11.8 61.18 31 35.47 56.69-26.49 26.49-70.21-2.87-56-37.34L240.22 199v121.85c25.3 12.54 22.26 41.85 9.08 55a34.34 34.34 0 0 1-48.55 0c-17.57-17.6-11.07-46.91 11.25-56v-123c-20.8-8.51-24.6-30.74-18.64-45L142.57 101 8.45 235.14a28.86 28.86 0 0 0 0 40.81l195.61 195.6a28.86 28.86 0 0 0 40.8 0l194.69-194.69a28.86 28.86 0 0 0 0-40.81z"/></svg>
  </div>
  <div class="md-source__repository">
    Gitee
  </div>
</a>
      </div>
    
  </nav>
  
    
      
<nav class="md-tabs" aria-label="Tabs" data-md-component="tabs">
  <div class="md-grid">
    <ul class="md-tabs__list">
      
        
  
  


  <li class="md-tabs__item">
    <a href="../.." class="md-tabs__link">
      欢迎
    </a>
  </li>

      
        
  
  


  
  
  
    <li class="md-tabs__item">
      <a href="../../whatsnew/3_3/" class="md-tabs__link">
        🔥 新版预告
      </a>
    </li>
  

      
        
  
  


  
  
  
    <li class="md-tabs__item">
      <a href="../../get_start/installation_and_import/" class="md-tabs__link">
        入门指南
      </a>
    </li>
  

      
        
  
  
    
  


  
  
  
    <li class="md-tabs__item">
      <a href="../../usage_introduction/" class="md-tabs__link md-tabs__link--active">
        使用文档
      </a>
    </li>
  

      
        
  
  


  
  
  
    <li class="md-tabs__item">
      <a href="../../demos/login_gitee/" class="md-tabs__link">
        示例和技巧
      </a>
    </li>
  

      
        
  
  


  <li class="md-tabs__item">
    <a href="../../Q%26A/" class="md-tabs__link">
      常见问题
    </a>
  </li>

      
        
  
  


  
  
  
    <li class="md-tabs__item">
      <a href="../../history/3.x/" class="md-tabs__link">
        版本历史
      </a>
    </li>
  

      
        
  
  


  <li class="md-tabs__item">
    <a href="https://gitee.com/g1879/DrissionPage/issues" class="md-tabs__link">
      意见建议
    </a>
  </li>

      
    </ul>
  </div>
</nav>
    
  
</header>
    
    <div class="md-container" data-md-component="container">
      
      
        
      
      <main class="md-main" data-md-component="main">
        <div class="md-main__inner md-grid">
          
            
              
              <div class="md-sidebar md-sidebar--primary" data-md-component="sidebar" data-md-type="navigation" >
                <div class="md-sidebar__scrollwrap">
                  <div class="md-sidebar__inner">
                    

  


<nav class="md-nav md-nav--primary md-nav--lifted" aria-label="Navigation" data-md-level="0">
  <label class="md-nav__title" for="__drawer">
    <a href="../.." title="DrissionPage" class="md-nav__button md-logo" aria-label="DrissionPage" data-md-component="logo">
      
  <img src="../../imgs/logo.png" alt="logo">

    </a>
    DrissionPage
  </label>
  
    <div class="md-nav__source">
      <a href="https://gitee.com/g1879/DrissionPage" title="Go to repository" class="md-source" data-md-component="source">
  <div class="md-source__icon md-icon">
    
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Free 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2023 Fonticons, Inc.--><path d="M439.55 236.05 244 40.45a28.87 28.87 0 0 0-40.81 0l-40.66 40.63 51.52 51.52c27.06-9.14 52.68 16.77 43.39 43.68l49.66 49.66c34.23-11.8 61.18 31 35.47 56.69-26.49 26.49-70.21-2.87-56-37.34L240.22 199v121.85c25.3 12.54 22.26 41.85 9.08 55a34.34 34.34 0 0 1-48.55 0c-17.57-17.6-11.07-46.91 11.25-56v-123c-20.8-8.51-24.6-30.74-18.64-45L142.57 101 8.45 235.14a28.86 28.86 0 0 0 0 40.81l195.61 195.6a28.86 28.86 0 0 0 40.8 0l194.69-194.69a28.86 28.86 0 0 0 0-40.81z"/></svg>
  </div>
  <div class="md-source__repository">
    Gitee
  </div>
</a>
    </div>
  
  <ul class="md-nav__list" data-md-scrollfix>
    
      
      
      

  
  
  
    <li class="md-nav__item">
      <a href="../.." class="md-nav__link">
        欢迎
      </a>
    </li>
  

    
      
      
      

  
  
  
    
    <li class="md-nav__item md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_2" >
      
      
      
        <label class="md-nav__link" for="__nav_2" id="__nav_2_label" tabindex="0">
          🔥 新版预告
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="1" aria-labelledby="__nav_2_label" aria-expanded="false">
        <label class="md-nav__title" for="__nav_2">
          <span class="md-nav__icon md-icon"></span>
          🔥 新版预告
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../whatsnew/3_3/" class="md-nav__link">
        💥 3.3 开发计划
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../whatsnew/3_2/" class="md-nav__link">
        💥 3.2 功能介绍
      </a>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

    
      
      
      

  
  
  
    
    <li class="md-nav__item md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_3" >
      
      
      
        <label class="md-nav__link" for="__nav_3" id="__nav_3_label" tabindex="0">
          入门指南
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="1" aria-labelledby="__nav_3_label" aria-expanded="false">
        <label class="md-nav__title" for="__nav_3">
          <span class="md-nav__icon md-icon"></span>
          入门指南
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../get_start/installation_and_import/" class="md-nav__link">
        🌏 安装和导入
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../get_start/before_start/" class="md-nav__link">
        🌏 准备工作
      </a>
    </li>
  

            
          
            
              
  
  
  
    
    <li class="md-nav__item md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_3_3" >
      
      
      
        <label class="md-nav__link" for="__nav_3_3" id="__nav_3_3_label" tabindex="0">
          🌏 上手示例
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="2" aria-labelledby="__nav_3_3_label" aria-expanded="false">
        <label class="md-nav__title" for="__nav_3_3">
          <span class="md-nav__icon md-icon"></span>
          🌏 上手示例
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../get_start/examples/control_browser/" class="md-nav__link">
        🗺️ 操控浏览器
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../get_start/examples/data_packets/" class="md-nav__link">
        🗺️ 收发数据包
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../get_start/examples/switch_mode/" class="md-nav__link">
        🗺️ 模式切换
      </a>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../get_start/basic_concept/" class="md-nav__link">
        ☀️ 基本概念
      </a>
    </li>
  

            
          
            
              
  
  
  
    
    <li class="md-nav__item md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_3_5" >
      
      
      
        <label class="md-nav__link" for="__nav_3_5" id="__nav_3_5_label" tabindex="0">
          ☀️ 特性和亮点
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="2" aria-labelledby="__nav_3_5_label" aria-expanded="false">
        <label class="md-nav__title" for="__nav_3_5">
          <span class="md-nav__icon md-icon"></span>
          ☀️ 特性和亮点
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../features/intimate_design/" class="md-nav__link">
        💖 贴心设计
      </a>
    </li>
  

            
          
            
              
  
  
  
    
    <li class="md-nav__item md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_3_5_2" >
      
      
      
        <label class="md-nav__link" for="__nav_3_5_2" id="__nav_3_5_2_label" tabindex="0">
          🌟 特性演示
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="3" aria-labelledby="__nav_3_5_2_label" aria-expanded="false">
        <label class="md-nav__title" for="__nav_3_5_2">
          <span class="md-nav__icon md-icon"></span>
          🌟 特性演示
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../features/features_demos/compare_with_requests/" class="md-nav__link">
        ⭐ 与 requests 对比
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../features/features_demos/compare_with_selenium/" class="md-nav__link">
        ⭐ 与 selenium 对比
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../features/features_demos/switch_mode/" class="md-nav__link">
        ⭐ 模式切换
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../features/features_demos/get_element_attributes/" class="md-nav__link">
        ⭐ 获取元素属性
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../features/features_demos/download_file/" class="md-nav__link">
        ⭐ 下载文件
      </a>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

    
      
      
      

  
  
    
  
  
    
    <li class="md-nav__item md-nav__item--active md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_4" checked>
      
      
      
        <label class="md-nav__link" for="__nav_4" id="__nav_4_label" tabindex="0">
          使用文档
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="1" aria-labelledby="__nav_4_label" aria-expanded="true">
        <label class="md-nav__title" for="__nav_4">
          <span class="md-nav__icon md-icon"></span>
          使用文档
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../usage_introduction/" class="md-nav__link">
        💬 概述
      </a>
    </li>
  

            
          
            
              
  
  
    
  
  
    
    <li class="md-nav__item md-nav__item--active md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_4_2" checked>
      
      
      
        <label class="md-nav__link" for="__nav_4_2" id="__nav_4_2_label" tabindex="0">
          📫 SessionPage
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="2" aria-labelledby="__nav_4_2_label" aria-expanded="true">
        <label class="md-nav__title" for="__nav_4_2">
          <span class="md-nav__icon md-icon"></span>
          📫 SessionPage
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../introduction/" class="md-nav__link">
        ✉️ 概述
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../create_page_object/" class="md-nav__link">
        ✉️ 创建页面对象
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../visit_web_page/" class="md-nav__link">
        ✉️ 访问网页
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../get_page_info/" class="md-nav__link">
        ✉️ 获取网页信息
      </a>
    </li>
  

            
          
            
              
  
  
    
  
  
    <li class="md-nav__item md-nav__item--active">
      
      <input class="md-nav__toggle md-toggle" type="checkbox" id="__toc">
      
      
      
        <label class="md-nav__link md-nav__link--active" for="__toc">
          ✉️ 查找元素
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <a href="./" class="md-nav__link md-nav__link--active">
        ✉️ 查找元素
      </a>
      
        

<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
  
  
  
  
    <label class="md-nav__title" for="__toc">
      <span class="md-nav__icon md-icon"></span>
      Table of contents
    </label>
    <ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
      
        <li class="md-nav__item">
  <a href="#_1" class="md-nav__link">
    ✅️️ 示例
  </a>
  
    <nav class="md-nav" aria-label="✅️️ 示例">
      <ul class="md-nav__list">
        
          <li class="md-nav__item">
  <a href="#_2" class="md-nav__link">
    📌 简单示例
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_3" class="md-nav__link">
    📌 实际示例
  </a>
  
</li>
        
      </ul>
    </nav>
  
</li>
      
        <li class="md-nav__item">
  <a href="#_4" class="md-nav__link">
    ✅️️ 查找元素方法
  </a>
  
    <nav class="md-nav" aria-label="✅️️ 查找元素方法">
      <ul class="md-nav__list">
        
          <li class="md-nav__item">
  <a href="#_5" class="md-nav__link">
    📌 查找单个元素
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_6" class="md-nav__link">
    📌 查找多个元素
  </a>
  
</li>
        
      </ul>
    </nav>
  
</li>
      
        <li class="md-nav__item">
  <a href="#_7" class="md-nav__link">
    ✅️️ 匹配模式
  </a>
  
    <nav class="md-nav" aria-label="✅️️ 匹配模式">
      <ul class="md-nav__list">
        
          <li class="md-nav__item">
  <a href="#_8" class="md-nav__link">
    📌 精确匹配 =
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_9" class="md-nav__link">
    📌 模糊匹配 :
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_10" class="md-nav__link">
    📌 匹配开头 ^
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_11" class="md-nav__link">
    📌 匹配结尾 $
  </a>
  
</li>
        
      </ul>
    </nav>
  
</li>
      
        <li class="md-nav__item">
  <a href="#_12" class="md-nav__link">
    ✅️️ 查找语法
  </a>
  
    <nav class="md-nav" aria-label="✅️️ 查找语法">
      <ul class="md-nav__list">
        
          <li class="md-nav__item">
  <a href="#id" class="md-nav__link">
    📌 id 匹配符 #
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#class" class="md-nav__link">
    📌 class 匹配符 .
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_13" class="md-nav__link">
    📌 单属性匹配符 @
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_14" class="md-nav__link">
    📌 多属性与匹配符 @@
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_15" class="md-nav__link">
    📌 多属性或匹配符@|
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#text" class="md-nav__link">
    📌 文本匹配符 text
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#text_1" class="md-nav__link">
    📌 文本匹配符 text()
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#tag" class="md-nav__link">
    📌 类型匹配符 tag
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#css-selector-css" class="md-nav__link">
    📌 css selector 匹配符 css
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#xpath-xpath" class="md-nav__link">
    📌 xpath 匹配符 xpath
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#selenium-loc" class="md-nav__link">
    📌 selenium 的 loc 元组
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#text_2" class="md-nav__link">
    📌 @@text()的技巧
  </a>
  
</li>
        
      </ul>
    </nav>
  
</li>
      
        <li class="md-nav__item">
  <a href="#_16" class="md-nav__link">
    ✅️️ 相对定位
  </a>
  
    <nav class="md-nav" aria-label="✅️️ 相对定位">
      <ul class="md-nav__list">
        
          <li class="md-nav__item">
  <a href="#_17" class="md-nav__link">
    📌 获取父级元素
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_18" class="md-nav__link">
    📌 获取直接子节点
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_19" class="md-nav__link">
    📌 获取后面的同级节点
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_20" class="md-nav__link">
    📌 获取前面的同级节点
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_21" class="md-nav__link">
    📌 在后面文档中查找节点
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_22" class="md-nav__link">
    📌 在前面文档中查找节点
  </a>
  
</li>
        
      </ul>
    </nav>
  
</li>
      
        <li class="md-nav__item">
  <a href="#_23" class="md-nav__link">
    ✅️️ 简化写法
  </a>
  
</li>
      
    </ul>
  
</nav>
      
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../get_element_info/" class="md-nav__link">
        ✉️ 获取元素信息
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../set_session/" class="md-nav__link">
        ✉️ 页面设置
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../session_options/" class="md-nav__link">
        ✉️ 启动配置
      </a>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

            
          
            
              
  
  
  
    
    <li class="md-nav__item md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_4_3" >
      
      
      
        <label class="md-nav__link" for="__nav_4_3" id="__nav_4_3_label" tabindex="0">
          🚀 ChromiumPage
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="2" aria-labelledby="__nav_4_3_label" aria-expanded="false">
        <label class="md-nav__title" for="__nav_4_3">
          <span class="md-nav__icon md-icon"></span>
          🚀 ChromiumPage
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/introduction/" class="md-nav__link">
        🛰️ 概述
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/create_page_object/" class="md-nav__link">
        🛰️ 创建页面对象
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/visit_web_page/" class="md-nav__link">
        🛰️ 访问网页
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/get_page_info/" class="md-nav__link">
        🛰️ 获取网页信息
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/page_operation/" class="md-nav__link">
        🛰️ 页面交互
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/find_elements/" class="md-nav__link">
        🛰️ 查找元素
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/get_element_info/" class="md-nav__link">
        🛰️ 获取元素信息
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/element_operation/" class="md-nav__link">
        🛰️ 元素交互
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/upload_files/" class="md-nav__link">
        🛰️ 文件上传
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/tab_operation/" class="md-nav__link">
        🛰️ 标签页操作
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/frame_operation/" class="md-nav__link">
        🛰️ iframe 操作
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/action_chains/" class="md-nav__link">
        🛰️ 动作链
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../ChromiumPage/browser_options/" class="md-nav__link">
        🛰️ 浏览器启动配置
      </a>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

            
          
            
              
  
  
  
    
    <li class="md-nav__item md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_4_4" >
      
      
      
        <label class="md-nav__link" for="__nav_4_4" id="__nav_4_4_label" tabindex="0">
          🌌 WebPage
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="2" aria-labelledby="__nav_4_4_label" aria-expanded="false">
        <label class="md-nav__title" for="__nav_4_4">
          <span class="md-nav__icon md-icon"></span>
          🌌 WebPage
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../WebPage/introduction/" class="md-nav__link">
        🪐 概述
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../WebPage/create_page_object/" class="md-nav__link">
        🪐 创建页面对象
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../WebPage/mode_switch/" class="md-nav__link">
        🪐 模式切换
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../WebPage/webpage_function/" class="md-nav__link">
        🪐 独有的功能
      </a>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

            
          
            
              
  
  
  
    
    <li class="md-nav__item md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_4_5" >
      
      
      
        <label class="md-nav__link" for="__nav_4_5" id="__nav_4_5_label" tabindex="0">
          🧰 进阶使用
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="2" aria-labelledby="__nav_4_5_label" aria-expanded="false">
        <label class="md-nav__title" for="__nav_4_5">
          <span class="md-nav__icon md-icon"></span>
          🧰 进阶使用
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../advance/ini_file/" class="md-nav__link">
        ⚙️ 配置文件的使用
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../advance/easy_set/" class="md-nav__link">
        ⚙️ easy_set 方法
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../advance/download/" class="md-nav__link">
        ⚙️ 下载文件
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../advance/errors/" class="md-nav__link">
        ⚙️ 异常的使用
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../advance/commands/" class="md-nav__link">
        ⚙️ 命令行的使用
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../advance/accelerate_collecting/" class="md-nav__link">
        ⚙️ 加速浏览器数据采集
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../advance/packaging/" class="md-nav__link">
        ⚙️ 打包程序
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../advance/monitor_network/" class="md-nav__link">
        ⚙️ 监听浏览器网络
      </a>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../MixPage/introduction/" class="md-nav__link">
        🛠 旧版（MixPage）
      </a>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

    
      
      
      

  
  
  
    
    <li class="md-nav__item md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_5" >
      
      
      
        <label class="md-nav__link" for="__nav_5" id="__nav_5_label" tabindex="0">
          示例和技巧
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="1" aria-labelledby="__nav_5_label" aria-expanded="false">
        <label class="md-nav__title" for="__nav_5">
          <span class="md-nav__icon md-icon"></span>
          示例和技巧
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../demos/login_gitee/" class="md-nav__link">
        🌠 自动登录码云
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../demos/maoyan_TOP100/" class="md-nav__link">
        🌠 采集猫眼电影 TOP100 榜
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../demos/starbucks_pics/" class="md-nav__link">
        🌠 下载星巴克产品图片
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../demos/douban_book_pics/" class="md-nav__link">
        🌠 下载豆瓣图书封面图片
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../demos/multithreading_with_tabs/" class="md-nav__link">
        🌠 多线程操作多标签页
      </a>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

    
      
      
      

  
  
  
    <li class="md-nav__item">
      <a href="../../Q%26A/" class="md-nav__link">
        常见问题
      </a>
    </li>
  

    
      
      
      

  
  
  
    
    <li class="md-nav__item md-nav__item--nested">
      
      
      
      
      <input class="md-nav__toggle md-toggle " type="checkbox" id="__nav_7" >
      
      
      
        <label class="md-nav__link" for="__nav_7" id="__nav_7_label" tabindex="0">
          版本历史
          <span class="md-nav__icon md-icon"></span>
        </label>
      
      <nav class="md-nav" data-md-level="1" aria-labelledby="__nav_7_label" aria-expanded="false">
        <label class="md-nav__title" for="__nav_7">
          <span class="md-nav__icon md-icon"></span>
          版本历史
        </label>
        <ul class="md-nav__list" data-md-scrollfix>
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../history/3.x/" class="md-nav__link">
        v3.x
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../history/2.x/" class="md-nav__link">
        v1.5 - v2.x
      </a>
    </li>
  

            
          
            
              
  
  
  
    <li class="md-nav__item">
      <a href="../../history/1.x/" class="md-nav__link">
        v0.x - v1.4
      </a>
    </li>
  

            
          
        </ul>
      </nav>
    </li>
  

    
      
      
      

  
  
  
    <li class="md-nav__item">
      <a href="https://gitee.com/g1879/DrissionPage/issues" class="md-nav__link">
        意见建议
      </a>
    </li>
  

    
  </ul>
</nav>
                  </div>
                </div>
              </div>
            
            
              
              <div class="md-sidebar md-sidebar--secondary" data-md-component="sidebar" data-md-type="toc" >
                <div class="md-sidebar__scrollwrap">
                  <div class="md-sidebar__inner">
                    

<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
  
  
  
  
    <label class="md-nav__title" for="__toc">
      <span class="md-nav__icon md-icon"></span>
      Table of contents
    </label>
    <ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
      
        <li class="md-nav__item">
  <a href="#_1" class="md-nav__link">
    ✅️️ 示例
  </a>
  
    <nav class="md-nav" aria-label="✅️️ 示例">
      <ul class="md-nav__list">
        
          <li class="md-nav__item">
  <a href="#_2" class="md-nav__link">
    📌 简单示例
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_3" class="md-nav__link">
    📌 实际示例
  </a>
  
</li>
        
      </ul>
    </nav>
  
</li>
      
        <li class="md-nav__item">
  <a href="#_4" class="md-nav__link">
    ✅️️ 查找元素方法
  </a>
  
    <nav class="md-nav" aria-label="✅️️ 查找元素方法">
      <ul class="md-nav__list">
        
          <li class="md-nav__item">
  <a href="#_5" class="md-nav__link">
    📌 查找单个元素
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_6" class="md-nav__link">
    📌 查找多个元素
  </a>
  
</li>
        
      </ul>
    </nav>
  
</li>
      
        <li class="md-nav__item">
  <a href="#_7" class="md-nav__link">
    ✅️️ 匹配模式
  </a>
  
    <nav class="md-nav" aria-label="✅️️ 匹配模式">
      <ul class="md-nav__list">
        
          <li class="md-nav__item">
  <a href="#_8" class="md-nav__link">
    📌 精确匹配 =
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_9" class="md-nav__link">
    📌 模糊匹配 :
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_10" class="md-nav__link">
    📌 匹配开头 ^
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_11" class="md-nav__link">
    📌 匹配结尾 $
  </a>
  
</li>
        
      </ul>
    </nav>
  
</li>
      
        <li class="md-nav__item">
  <a href="#_12" class="md-nav__link">
    ✅️️ 查找语法
  </a>
  
    <nav class="md-nav" aria-label="✅️️ 查找语法">
      <ul class="md-nav__list">
        
          <li class="md-nav__item">
  <a href="#id" class="md-nav__link">
    📌 id 匹配符 #
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#class" class="md-nav__link">
    📌 class 匹配符 .
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_13" class="md-nav__link">
    📌 单属性匹配符 @
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_14" class="md-nav__link">
    📌 多属性与匹配符 @@
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_15" class="md-nav__link">
    📌 多属性或匹配符@|
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#text" class="md-nav__link">
    📌 文本匹配符 text
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#text_1" class="md-nav__link">
    📌 文本匹配符 text()
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#tag" class="md-nav__link">
    📌 类型匹配符 tag
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#css-selector-css" class="md-nav__link">
    📌 css selector 匹配符 css
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#xpath-xpath" class="md-nav__link">
    📌 xpath 匹配符 xpath
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#selenium-loc" class="md-nav__link">
    📌 selenium 的 loc 元组
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#text_2" class="md-nav__link">
    📌 @@text()的技巧
  </a>
  
</li>
        
      </ul>
    </nav>
  
</li>
      
        <li class="md-nav__item">
  <a href="#_16" class="md-nav__link">
    ✅️️ 相对定位
  </a>
  
    <nav class="md-nav" aria-label="✅️️ 相对定位">
      <ul class="md-nav__list">
        
          <li class="md-nav__item">
  <a href="#_17" class="md-nav__link">
    📌 获取父级元素
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_18" class="md-nav__link">
    📌 获取直接子节点
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_19" class="md-nav__link">
    📌 获取后面的同级节点
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_20" class="md-nav__link">
    📌 获取前面的同级节点
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_21" class="md-nav__link">
    📌 在后面文档中查找节点
  </a>
  
</li>
        
          <li class="md-nav__item">
  <a href="#_22" class="md-nav__link">
    📌 在前面文档中查找节点
  </a>
  
</li>
        
      </ul>
    </nav>
  
</li>
      
        <li class="md-nav__item">
  <a href="#_23" class="md-nav__link">
    ✅️️ 简化写法
  </a>
  
</li>
      
    </ul>
  
</nav>
                  </div>
                </div>
              </div>
            
          
          
            <div class="md-content" data-md-component="content">
              <article class="md-content__inner md-typeset">
                
                  


  <h1>✉️ 查找元素</h1>

<p>本节介绍如何获取元素对象。</p>
<p>定位元素是自动化最重要的的技能，虽然可在开发者工具直接复制绝对路径，但这样做一来代码冗长，可读性低，二来难以应付动态变化的页面。<br />
本库提供一套简洁易用的语法，用于快速定位元素，并且内置等待功能、支持链式查找，减少了代码的复杂性。同时也兼容 css selector、xpath、selenium 原生的 loc 元组。</p>
<p>定位元素大致分为三种方法：</p>
<ul>
<li>在页面或元素内查找子元素</li>
<li>根据 DOM 结构相对定位</li>
<li>根据页面布局位置相对定位</li>
</ul>
<h2 id="_1">✅️️ 示例</h2>
<p>先看一些示例，后面在详细讲解用法。</p>
<h3 id="_2">📌 简单示例</h3>
<p>假设有这样一个页面，本节示例皆使用此页面：</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-0-1" name="__codelineno-0-1" href="#__codelineno-0-1"></a><span class="p">&lt;</span><span class="nt">html</span><span class="p">&gt;</span>
<a id="__codelineno-0-2" name="__codelineno-0-2" href="#__codelineno-0-2"></a><span class="p">&lt;</span><span class="nt">body</span><span class="p">&gt;</span>
<a id="__codelineno-0-3" name="__codelineno-0-3" href="#__codelineno-0-3"></a><span class="p">&lt;</span><span class="nt">div</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;one&quot;</span><span class="p">&gt;</span>
<a id="__codelineno-0-4" name="__codelineno-0-4" href="#__codelineno-0-4"></a>    <span class="p">&lt;</span><span class="nt">p</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;p_cls&quot;</span> <span class="na">name</span><span class="o">=</span><span class="s">&quot;row1&quot;</span><span class="p">&gt;</span>第一行<span class="p">&lt;/</span><span class="nt">p</span><span class="p">&gt;</span>
<a id="__codelineno-0-5" name="__codelineno-0-5" href="#__codelineno-0-5"></a>    <span class="p">&lt;</span><span class="nt">p</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;p_cls&quot;</span> <span class="na">name</span><span class="o">=</span><span class="s">&quot;row2&quot;</span><span class="p">&gt;</span>第二行<span class="p">&lt;/</span><span class="nt">p</span><span class="p">&gt;</span>
<a id="__codelineno-0-6" name="__codelineno-0-6" href="#__codelineno-0-6"></a>    <span class="p">&lt;</span><span class="nt">p</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;p_cls&quot;</span><span class="p">&gt;</span>第三行<span class="p">&lt;/</span><span class="nt">p</span><span class="p">&gt;</span>
<a id="__codelineno-0-7" name="__codelineno-0-7" href="#__codelineno-0-7"></a><span class="p">&lt;/</span><span class="nt">div</span><span class="p">&gt;</span>
<a id="__codelineno-0-8" name="__codelineno-0-8" href="#__codelineno-0-8"></a><span class="p">&lt;</span><span class="nt">div</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;two&quot;</span><span class="p">&gt;</span>
<a id="__codelineno-0-9" name="__codelineno-0-9" href="#__codelineno-0-9"></a>    第二个div
<a id="__codelineno-0-10" name="__codelineno-0-10" href="#__codelineno-0-10"></a><span class="p">&lt;/</span><span class="nt">div</span><span class="p">&gt;</span>
<a id="__codelineno-0-11" name="__codelineno-0-11" href="#__codelineno-0-11"></a><span class="p">&lt;/</span><span class="nt">body</span><span class="p">&gt;</span>
<a id="__codelineno-0-12" name="__codelineno-0-12" href="#__codelineno-0-12"></a><span class="p">&lt;/</span><span class="nt">html</span><span class="p">&gt;</span>
</code></pre></div>
<p>我们可以用页面对象去获取其中的元素：</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-1-1" name="__codelineno-1-1" href="#__codelineno-1-1"></a><span class="c1"># 获取 id 为 one 的元素</span>
<a id="__codelineno-1-2" name="__codelineno-1-2" href="#__codelineno-1-2"></a><span class="n">div1</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;#one&#39;</span><span class="p">)</span>
<a id="__codelineno-1-3" name="__codelineno-1-3" href="#__codelineno-1-3"></a>
<a id="__codelineno-1-4" name="__codelineno-1-4" href="#__codelineno-1-4"></a><span class="c1"># 获取 name 属性为 row1 的元素</span>
<a id="__codelineno-1-5" name="__codelineno-1-5" href="#__codelineno-1-5"></a><span class="n">p1</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@name=row1&#39;</span><span class="p">)</span>
<a id="__codelineno-1-6" name="__codelineno-1-6" href="#__codelineno-1-6"></a>
<a id="__codelineno-1-7" name="__codelineno-1-7" href="#__codelineno-1-7"></a><span class="c1"># 获取包含“第二个div”文本的元素</span>
<a id="__codelineno-1-8" name="__codelineno-1-8" href="#__codelineno-1-8"></a><span class="n">div2</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;第二个div&#39;</span><span class="p">)</span>
<a id="__codelineno-1-9" name="__codelineno-1-9" href="#__codelineno-1-9"></a>
<a id="__codelineno-1-10" name="__codelineno-1-10" href="#__codelineno-1-10"></a><span class="c1"># 获取所有div元素</span>
<a id="__codelineno-1-11" name="__codelineno-1-11" href="#__codelineno-1-11"></a><span class="n">div_list</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">eles</span><span class="p">(</span><span class="s1">&#39;tag:div&#39;</span><span class="p">)</span>
</code></pre></div>
<p>也可以获取到一个元素，然后在它里面或周围查找元素：</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-2-1" name="__codelineno-2-1" href="#__codelineno-2-1"></a><span class="c1"># 获取到一个元素div1</span>
<a id="__codelineno-2-2" name="__codelineno-2-2" href="#__codelineno-2-2"></a><span class="n">div1</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;#one&#39;</span><span class="p">)</span>
<a id="__codelineno-2-3" name="__codelineno-2-3" href="#__codelineno-2-3"></a>
<a id="__codelineno-2-4" name="__codelineno-2-4" href="#__codelineno-2-4"></a><span class="c1"># 在div1内查找所有p元素</span>
<a id="__codelineno-2-5" name="__codelineno-2-5" href="#__codelineno-2-5"></a><span class="n">p_list</span> <span class="o">=</span> <span class="n">div1</span><span class="o">.</span><span class="n">eles</span><span class="p">(</span><span class="s1">&#39;tag:p&#39;</span><span class="p">)</span>
<a id="__codelineno-2-6" name="__codelineno-2-6" href="#__codelineno-2-6"></a>
<a id="__codelineno-2-7" name="__codelineno-2-7" href="#__codelineno-2-7"></a><span class="c1"># 获取div1后面一个元素</span>
<a id="__codelineno-2-8" name="__codelineno-2-8" href="#__codelineno-2-8"></a><span class="n">div2</span> <span class="o">=</span> <span class="n">div1</span><span class="o">.</span><span class="n">next</span><span class="p">()</span>
</code></pre></div>
<hr />
<h3 id="_3">📌 实际示例</h3>
<p>复制此代码可直接运行查看结果。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-3-1" name="__codelineno-3-1" href="#__codelineno-3-1"></a><span class="kn">from</span> <span class="nn">DrissionPage</span> <span class="kn">import</span> <span class="n">SessionPage</span>
<a id="__codelineno-3-2" name="__codelineno-3-2" href="#__codelineno-3-2"></a>
<a id="__codelineno-3-3" name="__codelineno-3-3" href="#__codelineno-3-3"></a><span class="n">page</span> <span class="o">=</span> <span class="n">SessionPage</span><span class="p">()</span>
<a id="__codelineno-3-4" name="__codelineno-3-4" href="#__codelineno-3-4"></a><span class="n">page</span><span class="o">.</span><span class="n">get</span><span class="p">(</span><span class="s1">&#39;https://gitee.com/explore&#39;</span><span class="p">)</span>
<a id="__codelineno-3-5" name="__codelineno-3-5" href="#__codelineno-3-5"></a>
<a id="__codelineno-3-6" name="__codelineno-3-6" href="#__codelineno-3-6"></a><span class="c1"># 获取包含“全部推荐项目”文本的 ul 元素</span>
<a id="__codelineno-3-7" name="__codelineno-3-7" href="#__codelineno-3-7"></a><span class="n">ul_ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:ul@@text():全部推荐项目&#39;</span><span class="p">)</span>  
<a id="__codelineno-3-8" name="__codelineno-3-8" href="#__codelineno-3-8"></a>
<a id="__codelineno-3-9" name="__codelineno-3-9" href="#__codelineno-3-9"></a><span class="c1"># 获取该 ul 元素下所有 a 元素</span>
<a id="__codelineno-3-10" name="__codelineno-3-10" href="#__codelineno-3-10"></a><span class="n">titles</span> <span class="o">=</span> <span class="n">ul_ele</span><span class="o">.</span><span class="n">eles</span><span class="p">(</span><span class="s1">&#39;tag:a&#39;</span><span class="p">)</span>  
<a id="__codelineno-3-11" name="__codelineno-3-11" href="#__codelineno-3-11"></a>
<a id="__codelineno-3-12" name="__codelineno-3-12" href="#__codelineno-3-12"></a><span class="c1"># 遍历列表，打印每个 a 元素的文本</span>
<a id="__codelineno-3-13" name="__codelineno-3-13" href="#__codelineno-3-13"></a><span class="k">for</span> <span class="n">i</span> <span class="ow">in</span> <span class="n">titles</span><span class="p">:</span>  
<a id="__codelineno-3-14" name="__codelineno-3-14" href="#__codelineno-3-14"></a>    <span class="nb">print</span><span class="p">(</span><span class="n">i</span><span class="o">.</span><span class="n">text</span><span class="p">)</span>
</code></pre></div>
<p><strong>输出：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-4-1" name="__codelineno-4-1" href="#__codelineno-4-1"></a>全部推荐项目
<a id="__codelineno-4-2" name="__codelineno-4-2" href="#__codelineno-4-2"></a>前沿技术
<a id="__codelineno-4-3" name="__codelineno-4-3" href="#__codelineno-4-3"></a>智能硬件
<a id="__codelineno-4-4" name="__codelineno-4-4" href="#__codelineno-4-4"></a>IOT/物联网/边缘计算
<a id="__codelineno-4-5" name="__codelineno-4-5" href="#__codelineno-4-5"></a>车载应用
<a id="__codelineno-4-6" name="__codelineno-4-6" href="#__codelineno-4-6"></a>...
</code></pre></div>
<hr />
<h2 id="_4">✅️️ 查找元素方法</h2>
<h3 id="_5">📌 查找单个元素</h3>
<p>🔸 <code>ele()</code></p>
<p>页面对象和元素对象都拥有此方法，用于查找第一个匹配条件的元素或节点。</p>
<p>页面对象和元素对象的<code>ele()</code>方法参数名称稍有不同，但用法一样。</p>
<p><code>SessionPage</code>和<code>ChromiumPage</code>获取元素的方法是一致的，但前者返回的元素对象为<code>SessionElement</code>，后者是<code>ChromiumElement</code>。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>loc_or_str</code><br>（元素对象）</td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center">必填</td>
<td>元素的定位信息。可以是查询字符串，或 loc 元组</td>
</tr>
<tr>
<td align="center"><code>loc_or_ele</code><br>（页面对象）</td>
<td align="center"><code>str</code><br><code>SessionElement</code><br><code>Tuple[str, str]</code></td>
<td align="center">必填</td>
<td>元素的定位信息。可以是查询字符串、loc 元组或一个<code>SessionElement</code>对象</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>SessionElement</code></td>
<td>返回查找到的第一个符合条件的元素对象</td>
</tr>
<tr>
<td align="center"><code>NoneElement</code></td>
<td>未找到符合条件的元素时返回<code>NoneElement</code></td>
</tr>
<tr>
<td align="center"><code>str</code></td>
<td>使用 xpath，可直接获取后代元素的属性（浏览器页面对象下查找不可用）</td>
</tr>
</tbody>
</table>
<div class="admonition note">
<p class="admonition-title">说明：</p>
<p>loc 元组是指 selenium 定位符，例：(By.ID, 'XXXXX')。下同。</p>
</div>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-5-1" name="__codelineno-5-1" href="#__codelineno-5-1"></a><span class="kn">from</span> <span class="nn">DrissionPage</span> <span class="kn">import</span> <span class="n">SessionPage</span>
<a id="__codelineno-5-2" name="__codelineno-5-2" href="#__codelineno-5-2"></a>
<a id="__codelineno-5-3" name="__codelineno-5-3" href="#__codelineno-5-3"></a><span class="n">page</span> <span class="o">=</span> <span class="n">SessionPage</span><span class="p">()</span>
<a id="__codelineno-5-4" name="__codelineno-5-4" href="#__codelineno-5-4"></a>
<a id="__codelineno-5-5" name="__codelineno-5-5" href="#__codelineno-5-5"></a><span class="c1"># 在页面内查找元素</span>
<a id="__codelineno-5-6" name="__codelineno-5-6" href="#__codelineno-5-6"></a><span class="n">ele1</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;#one&#39;</span><span class="p">)</span>
<a id="__codelineno-5-7" name="__codelineno-5-7" href="#__codelineno-5-7"></a>
<a id="__codelineno-5-8" name="__codelineno-5-8" href="#__codelineno-5-8"></a><span class="c1"># 在元素内查找后代元素</span>
<a id="__codelineno-5-9" name="__codelineno-5-9" href="#__codelineno-5-9"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;第二行&#39;</span><span class="p">)</span>
<a id="__codelineno-5-10" name="__codelineno-5-10" href="#__codelineno-5-10"></a>
<a id="__codelineno-5-11" name="__codelineno-5-11" href="#__codelineno-5-11"></a><span class="c1"># 使用 xpath 获取后代中第一个 div 元素的 class 属性（元素内查找可用）</span>
<a id="__codelineno-5-12" name="__codelineno-5-12" href="#__codelineno-5-12"></a><span class="n">ele_class</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;xpath://p/@class&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="_6">📌 查找多个元素</h3>
<p>🔸 <code>eles()</code></p>
<p>此方法与<code>ele()</code>相似，但返回的是匹配到的所有元素组成的列表，用 xpath 获取元素属性时，返回属性文本组成的列表。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>loc_or_str</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center">必填</td>
<td>元素的定位信息，可以是查询字符串，或 loc 元组</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>List[SessionElement]</code></td>
<td>找到的所有<code>SessionElement</code>组成的列表</td>
</tr>
<tr>
<td align="center"><code>List[str]</code></td>
<td>使用 xpath，可直接获取后代元素的属性（浏览器页面对象下查找不可用）</td>
</tr>
</tbody>
</table>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-6-1" name="__codelineno-6-1" href="#__codelineno-6-1"></a><span class="c1"># 获取ele元素内的所有p元素</span>
<a id="__codelineno-6-2" name="__codelineno-6-2" href="#__codelineno-6-2"></a><span class="n">p_eles</span> <span class="o">=</span> <span class="n">ele</span><span class="o">.</span><span class="n">eles</span><span class="p">(</span><span class="s1">&#39;tag:p&#39;</span><span class="p">)</span>
<a id="__codelineno-6-3" name="__codelineno-6-3" href="#__codelineno-6-3"></a><span class="c1"># 打印第一个p元素的文本</span>
<a id="__codelineno-6-4" name="__codelineno-6-4" href="#__codelineno-6-4"></a><span class="nb">print</span><span class="p">(</span><span class="n">p_eles</span><span class="p">[</span><span class="mi">0</span><span class="p">])</span>  
</code></pre></div>
<hr />
<h2 id="_7">✅️️ 匹配模式</h2>
<p>匹配模式指某个查询中匹配条件的方式，有以下几种：</p>
<h3 id="_8">📌 精确匹配 <code>=</code></h3>
<p>表示精确匹配，匹配完全符合的文本或属性。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-7-1" name="__codelineno-7-1" href="#__codelineno-7-1"></a><span class="c1"># 获取name属性为&#39;row1&#39;的元素</span>
<a id="__codelineno-7-2" name="__codelineno-7-2" href="#__codelineno-7-2"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="p">(</span><span class="s1">&#39;@name=row1&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="_9">📌 模糊匹配 <code>:</code></h3>
<p>表示模糊匹配，匹配含有指定字符串的文本或属性。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-8-1" name="__codelineno-8-1" href="#__codelineno-8-1"></a><span class="c1"># 获取name属性包含&#39;row1&#39;的元素</span>
<a id="__codelineno-8-2" name="__codelineno-8-2" href="#__codelineno-8-2"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="p">(</span><span class="s1">&#39;@name:row1&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="_10">📌 匹配开头 <code>^</code></h3>
<p>表示匹配开头，匹配开头为指定字符串的文本或属性。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-9-1" name="__codelineno-9-1" href="#__codelineno-9-1"></a><span class="c1"># 获取name属性以&#39;row1&#39;开头的元素</span>
<a id="__codelineno-9-2" name="__codelineno-9-2" href="#__codelineno-9-2"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="p">(</span><span class="s1">&#39;@name^row1&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="_11">📌 匹配结尾 <code>$</code></h3>
<p>表示匹配结尾，匹配结尾为指定字符串的文本或属性。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-10-1" name="__codelineno-10-1" href="#__codelineno-10-1"></a><span class="c1"># 获取name属性以&#39;w1&#39;结尾的元素</span>
<a id="__codelineno-10-2" name="__codelineno-10-2" href="#__codelineno-10-2"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="p">(</span><span class="s1">&#39;@name$w1&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h2 id="_12">✅️️ 查找语法</h2>
<p>关键字是出现在定位语句最左边，用于指明该语句以哪种方式去查找元素。</p>
<h3 id="id">📌 id 匹配符 <code>#</code></h3>
<p>表示<code>id</code>属性，只在语句最前面且单独使用时生效，可配合匹配模式使用。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-11-1" name="__codelineno-11-1" href="#__codelineno-11-1"></a><span class="c1"># 在页面中查找id属性为one的元素</span>
<a id="__codelineno-11-2" name="__codelineno-11-2" href="#__codelineno-11-2"></a><span class="n">ele1</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;#one&#39;</span><span class="p">)</span>
<a id="__codelineno-11-3" name="__codelineno-11-3" href="#__codelineno-11-3"></a>
<a id="__codelineno-11-4" name="__codelineno-11-4" href="#__codelineno-11-4"></a><span class="c1"># 在ele1元素内查找id属性包含ne文本的元素</span>
<a id="__codelineno-11-5" name="__codelineno-11-5" href="#__codelineno-11-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;#:ne&#39;</span><span class="p">)</span>  
</code></pre></div>
<hr />
<h3 id="class">📌 class 匹配符 <code>.</code></h3>
<p>表示<code>class</code>属性，只在语句最前面且单独使用时生效，可配合匹配模式使用。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-12-1" name="__codelineno-12-1" href="#__codelineno-12-1"></a><span class="c1"># 查找class属性为p_cls的元素</span>
<a id="__codelineno-12-2" name="__codelineno-12-2" href="#__codelineno-12-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;.p_cls&#39;</span><span class="p">)</span>
<a id="__codelineno-12-3" name="__codelineno-12-3" href="#__codelineno-12-3"></a>
<a id="__codelineno-12-4" name="__codelineno-12-4" href="#__codelineno-12-4"></a><span class="c1"># 查找class属性&#39;_cls&#39;文本开头的元素</span>
<a id="__codelineno-12-5" name="__codelineno-12-5" href="#__codelineno-12-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;.^_cls&#39;</span><span class="p">)</span>  
</code></pre></div>
<hr />
<h3 id="_13">📌 单属性匹配符 <code>@</code></h3>
<p>表示某个属性，只匹配一个属性。<br />
<code>@</code>关键字只有一个简单功能，就是匹配<code>@</code>后面的内容，不再对后面的字符串进行解析。因此即使后面的字符串也存在<code>@</code>或<code>@@</code>，也作为要匹配的内容对待。</p>
<div class="admonition warning">
<p class="admonition-title">注意</p>
<p>如果属性中包含特殊字符（如包含<code>@</code>），用这个方式不能正确匹配到，须使用 css selector 方式查找。且特殊字符要用<code>\</code>转义。</p>
</div>
<div class="highlight"><pre><span></span><code><a id="__codelineno-13-1" name="__codelineno-13-1" href="#__codelineno-13-1"></a><span class="c1"># 查找name属性为row1的元素</span>
<a id="__codelineno-13-2" name="__codelineno-13-2" href="#__codelineno-13-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@name=row1&#39;</span><span class="p">)</span>
<a id="__codelineno-13-3" name="__codelineno-13-3" href="#__codelineno-13-3"></a>
<a id="__codelineno-13-4" name="__codelineno-13-4" href="#__codelineno-13-4"></a><span class="c1"># 查找name属性包含row文本的元素</span>
<a id="__codelineno-13-5" name="__codelineno-13-5" href="#__codelineno-13-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@name:row&#39;</span><span class="p">)</span>
<a id="__codelineno-13-6" name="__codelineno-13-6" href="#__codelineno-13-6"></a>
<a id="__codelineno-13-7" name="__codelineno-13-7" href="#__codelineno-13-7"></a><span class="c1"># 查找name属性以row开头的元素</span>
<a id="__codelineno-13-8" name="__codelineno-13-8" href="#__codelineno-13-8"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@name^row&#39;</span><span class="p">)</span>
<a id="__codelineno-13-9" name="__codelineno-13-9" href="#__codelineno-13-9"></a>
<a id="__codelineno-13-10" name="__codelineno-13-10" href="#__codelineno-13-10"></a><span class="c1"># 查找有name属性的元素</span>
<a id="__codelineno-13-11" name="__codelineno-13-11" href="#__codelineno-13-11"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@name&#39;</span><span class="p">)</span>
<a id="__codelineno-13-12" name="__codelineno-13-12" href="#__codelineno-13-12"></a>
<a id="__codelineno-13-13" name="__codelineno-13-13" href="#__codelineno-13-13"></a><span class="c1"># 查找没有任何属性的元素</span>
<a id="__codelineno-13-14" name="__codelineno-13-14" href="#__codelineno-13-14"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@&#39;</span><span class="p">)</span>
<a id="__codelineno-13-15" name="__codelineno-13-15" href="#__codelineno-13-15"></a>
<a id="__codelineno-13-16" name="__codelineno-13-16" href="#__codelineno-13-16"></a><span class="c1"># 查找email属性为abc@def.com的元素，有多个@也不会重复处理</span>
<a id="__codelineno-13-17" name="__codelineno-13-17" href="#__codelineno-13-17"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@email=abc@def.com&#39;</span><span class="p">)</span>  
<a id="__codelineno-13-18" name="__codelineno-13-18" href="#__codelineno-13-18"></a>
<a id="__codelineno-13-19" name="__codelineno-13-19" href="#__codelineno-13-19"></a><span class="c1"># 属性中有特殊字符的情形，匹配abc@def属性等于v的元素</span>
<a id="__codelineno-13-20" name="__codelineno-13-20" href="#__codelineno-13-20"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;css:div[abc\@def=&quot;v&quot;]&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="_14">📌 多属性与匹配符 <code>@@</code></h3>
<p>匹配同时符合多个条件的元素时使用，每个条件前面添加<code>@@</code>作为开头。</p>
<p>能匹配要忽略的元素，匹配文本时也和<code>@</code>不一样。  </p>
<p><code>@@</code>后跟<code>-</code>时，表示 not。如：</p>
<ul>
<li>
<p><code>@@-name</code>表示匹配没有<code>name</code>属性的元素</p>
</li>
<li>
<p><code>@@-name=ele_name</code>表示匹配<code>name</code>属性不为<code>ele_name</code>的元素</p>
</li>
</ul>
<p>如有以下情况，不能使用此方式，须改用 xpath 的方式：</p>
<ul>
<li>
<p>匹配文本或属性中出现<code>@@</code></p>
</li>
<li>
<p>属性名本身以<code>-</code>开头</p>
</li>
</ul>
<div class="highlight"><pre><span></span><code><a id="__codelineno-14-1" name="__codelineno-14-1" href="#__codelineno-14-1"></a><span class="c1"># 查找name属性为row1且class属性包含cls文本的元素</span>
<a id="__codelineno-14-2" name="__codelineno-14-2" href="#__codelineno-14-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@@name=row1@@class:cls&#39;</span><span class="p">)</span>
<a id="__codelineno-14-3" name="__codelineno-14-3" href="#__codelineno-14-3"></a>
<a id="__codelineno-14-4" name="__codelineno-14-4" href="#__codelineno-14-4"></a><span class="c1"># 查找没有class属性的元素</span>
<a id="__codelineno-14-5" name="__codelineno-14-5" href="#__codelineno-14-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@@-class&#39;</span><span class="p">)</span>
<a id="__codelineno-14-6" name="__codelineno-14-6" href="#__codelineno-14-6"></a>
<a id="__codelineno-14-7" name="__codelineno-14-7" href="#__codelineno-14-7"></a><span class="c1"># 查找name属性不包含row1的元素</span>
<a id="__codelineno-14-8" name="__codelineno-14-8" href="#__codelineno-14-8"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@@-name:row1&#39;</span><span class="p">)</span>
</code></pre></div>
<p><code>@@</code>可以与下文介绍的<code>tag</code>配合使用：</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-15-1" name="__codelineno-15-1" href="#__codelineno-15-1"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:div@@class=p_cls@@name=row1&#39;</span><span class="p">)</span>
</code></pre></div>
<div class="admonition warning">
<p class="admonition-title">注意</p>
<p>如果属性中包含特殊字符（如包含<code>@</code>），用这个方式不能正确匹配到，须使用 css selector 方式查找。且特殊字符要用<code>\</code>转义。</p>
</div>
<div class="highlight"><pre><span></span><code><a id="__codelineno-16-1" name="__codelineno-16-1" href="#__codelineno-16-1"></a><span class="c1"># @@与@|混用</span>
<a id="__codelineno-16-2" name="__codelineno-16-2" href="#__codelineno-16-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="p">(</span><span class="s1">&#39;@@id=one@|id=two&#39;</span><span class="p">)</span>
</code></pre></div>
<p>这个写法会被程序认为是要查找 id 为 <code>'one@|id=two'</code>的元素。</p>
<hr />
<h3 id="_15">📌 多属性或匹配符<code>@|</code></h3>
<p>匹配符合多个条件中任一项的元素时使用，每个条件前面添加<code>@|</code>作为开头。</p>
<p>用法与<code>@@</code>一致，也可以带<code>-</code>表示 not。注意事项与<code>@@</code>一致。</p>
<div class="admonition warning">
<p class="admonition-title">注意</p>
<p><code>@@</code>和<code>@|</code>不能同时生效，如果语句中同时出现两者，以最先出现的为准，而后出现的会识别为条件内容。</p>
</div>
<div class="highlight"><pre><span></span><code><a id="__codelineno-17-1" name="__codelineno-17-1" href="#__codelineno-17-1"></a><span class="c1"># 查找id属性为one或id属性为two的元素</span>
<a id="__codelineno-17-2" name="__codelineno-17-2" href="#__codelineno-17-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@|id=one@|id=two&#39;</span><span class="p">)</span>
</code></pre></div>
<p><code>@|</code>可以与下文介绍的<code>tag</code>配合使用：</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-18-1" name="__codelineno-18-1" href="#__codelineno-18-1"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:div@|class=p_cls@|name=row1&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="text">📌 文本匹配符 <code>text</code></h3>
<p>要匹配的文本，查询字符串如开头没有任何关键字，也表示根据传入的文本作模糊查找。<br />
如果元素内有多个直接的文本节点，精确查找时可匹配所有文本节点拼成的字符串，模糊查找时可匹配每个文本节点。</p>
<p>没有任何匹配符时，默认匹配文本。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-19-1" name="__codelineno-19-1" href="#__codelineno-19-1"></a><span class="c1"># 查找文本为“第二行”的元素</span>
<a id="__codelineno-19-2" name="__codelineno-19-2" href="#__codelineno-19-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;text=第二行&#39;</span><span class="p">)</span>
<a id="__codelineno-19-3" name="__codelineno-19-3" href="#__codelineno-19-3"></a>
<a id="__codelineno-19-4" name="__codelineno-19-4" href="#__codelineno-19-4"></a><span class="c1"># 查找文本包含“第二”的元素</span>
<a id="__codelineno-19-5" name="__codelineno-19-5" href="#__codelineno-19-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;text:第二&#39;</span><span class="p">)</span>
<a id="__codelineno-19-6" name="__codelineno-19-6" href="#__codelineno-19-6"></a>
<a id="__codelineno-19-7" name="__codelineno-19-7" href="#__codelineno-19-7"></a><span class="c1"># 与上一行一致</span>
<a id="__codelineno-19-8" name="__codelineno-19-8" href="#__codelineno-19-8"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;第二&#39;</span><span class="p">)</span>  
</code></pre></div>
<div class="admonition tip">
<p class="admonition-title">Tips</p>
<p>若要查找的文本包含<code>text:</code> ，可下面这样写，即第一个<code>text:</code> 为关键字，第二个是要查找的内容：</p>
</div>
<div class="highlight"><pre><span></span><code><a id="__codelineno-20-1" name="__codelineno-20-1" href="#__codelineno-20-1"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;text:text:&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="text_1">📌 文本匹配符 <code>text()</code></h3>
<p>作为查找属性时使用的文本关键字，必须与<code>@</code>或<code>@@</code>配合使用。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-21-1" name="__codelineno-21-1" href="#__codelineno-21-1"></a><span class="c1"># 查找文本为“第二行”的元素</span>
<a id="__codelineno-21-2" name="__codelineno-21-2" href="#__codelineno-21-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@text()=第二行&#39;</span><span class="p">)</span>
<a id="__codelineno-21-3" name="__codelineno-21-3" href="#__codelineno-21-3"></a>
<a id="__codelineno-21-4" name="__codelineno-21-4" href="#__codelineno-21-4"></a><span class="c1"># 查找文本包含“第二行”的元素</span>
<a id="__codelineno-21-5" name="__codelineno-21-5" href="#__codelineno-21-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@text():二行&#39;</span><span class="p">)</span>
<a id="__codelineno-21-6" name="__codelineno-21-6" href="#__codelineno-21-6"></a>
<a id="__codelineno-21-7" name="__codelineno-21-7" href="#__codelineno-21-7"></a><span class="c1"># 查找文本以“第二”开头且class属性为p_cls的元素</span>
<a id="__codelineno-21-8" name="__codelineno-21-8" href="#__codelineno-21-8"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@@text()^第二@@class=p_cls&#39;</span><span class="p">)</span>
<a id="__codelineno-21-9" name="__codelineno-21-9" href="#__codelineno-21-9"></a>
<a id="__codelineno-21-10" name="__codelineno-21-10" href="#__codelineno-21-10"></a><span class="c1"># 查找文本为“二行”且没有任何属性的元素（因第一个 @@ 后为空）</span>
<a id="__codelineno-21-11" name="__codelineno-21-11" href="#__codelineno-21-11"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@@@@text():二行&#39;</span><span class="p">)</span>
<a id="__codelineno-21-12" name="__codelineno-21-12" href="#__codelineno-21-12"></a>
<a id="__codelineno-21-13" name="__codelineno-21-13" href="#__codelineno-21-13"></a><span class="c1"># 查找直接子文本包含“二行”字符串的元素</span>
<a id="__codelineno-21-14" name="__codelineno-21-14" href="#__codelineno-21-14"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@text():二行&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="tag">📌 类型匹配符 <code>tag</code></h3>
<p>表示元素的标签，只在语句最前面且单独使用时生效，可与<code>@</code>、<code>@@</code>或<code>@|</code>配合使用。<code>tag:</code>与<code>tag=</code>效果一致，没有<code>tag^</code>和<code>tag$</code>语法。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-22-1" name="__codelineno-22-1" href="#__codelineno-22-1"></a><span class="c1"># 定位div元素</span>
<a id="__codelineno-22-2" name="__codelineno-22-2" href="#__codelineno-22-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:div&#39;</span><span class="p">)</span>
<a id="__codelineno-22-3" name="__codelineno-22-3" href="#__codelineno-22-3"></a>
<a id="__codelineno-22-4" name="__codelineno-22-4" href="#__codelineno-22-4"></a><span class="c1"># 定位class属性为p_cls的p元素</span>
<a id="__codelineno-22-5" name="__codelineno-22-5" href="#__codelineno-22-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:p@class=p_cls&#39;</span><span class="p">)</span>
<a id="__codelineno-22-6" name="__codelineno-22-6" href="#__codelineno-22-6"></a>
<a id="__codelineno-22-7" name="__codelineno-22-7" href="#__codelineno-22-7"></a><span class="c1"># 定位文本为&quot;第二行&quot;的p元素</span>
<a id="__codelineno-22-8" name="__codelineno-22-8" href="#__codelineno-22-8"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:p@text()=第二行&#39;</span><span class="p">)</span>
<a id="__codelineno-22-9" name="__codelineno-22-9" href="#__codelineno-22-9"></a>
<a id="__codelineno-22-10" name="__codelineno-22-10" href="#__codelineno-22-10"></a><span class="c1"># 定位class属性为p_cls且文本为“第二行”的p元素</span>
<a id="__codelineno-22-11" name="__codelineno-22-11" href="#__codelineno-22-11"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:p@@class=p_cls@@text()=第二行&#39;</span><span class="p">)</span>
<a id="__codelineno-22-12" name="__codelineno-22-12" href="#__codelineno-22-12"></a>
<a id="__codelineno-22-13" name="__codelineno-22-13" href="#__codelineno-22-13"></a><span class="c1"># 定位class属性为p_cls或文本为“第二行”的p元素</span>
<a id="__codelineno-22-14" name="__codelineno-22-14" href="#__codelineno-22-14"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:p@|class=p_cls@|text()=第二行&#39;</span><span class="p">)</span>
<a id="__codelineno-22-15" name="__codelineno-22-15" href="#__codelineno-22-15"></a>
<a id="__codelineno-22-16" name="__codelineno-22-16" href="#__codelineno-22-16"></a><span class="c1"># 查找直接文本节点包含“二行”字符串的p元素</span>
<a id="__codelineno-22-17" name="__codelineno-22-17" href="#__codelineno-22-17"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:p@text():二行&#39;</span><span class="p">)</span>
<a id="__codelineno-22-18" name="__codelineno-22-18" href="#__codelineno-22-18"></a>
<a id="__codelineno-22-19" name="__codelineno-22-19" href="#__codelineno-22-19"></a><span class="c1"># 查找内部文本节点包含“二行”字符串的p元素</span>
<a id="__codelineno-22-20" name="__codelineno-22-20" href="#__codelineno-22-20"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:p@@text():二行&#39;</span><span class="p">)</span>  
</code></pre></div>
<div class="admonition warning">
<p class="admonition-title">注意</p>
<p><code>tag:div@text():text</code> 和 <code>tag:div@@text():text</code> 是有区别的，前者只在<code>div</code>的直接文本节点搜索，后者搜索<code>div</code>的整个内部。</p>
</div>
<hr />
<h3 id="css-selector-css">📌 css selector 匹配符 <code>css</code></h3>
<p>表示用 css selector 方式查找元素。<code>css:</code>与<code>css=</code>效果一致，没有<code>css^</code>和<code>css$</code>语法。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-23-1" name="__codelineno-23-1" href="#__codelineno-23-1"></a><span class="c1"># 查找 div 元素</span>
<a id="__codelineno-23-2" name="__codelineno-23-2" href="#__codelineno-23-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;css:.div&#39;</span><span class="p">)</span>
<a id="__codelineno-23-3" name="__codelineno-23-3" href="#__codelineno-23-3"></a>
<a id="__codelineno-23-4" name="__codelineno-23-4" href="#__codelineno-23-4"></a><span class="c1"># 查找 div 子元素元素，这个写法是本库特有，原生不支持</span>
<a id="__codelineno-23-5" name="__codelineno-23-5" href="#__codelineno-23-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;css:&gt;div&#39;</span><span class="p">)</span>  
</code></pre></div>
<hr />
<h3 id="xpath-xpath">📌 xpath 匹配符 <code>xpath</code></h3>
<p>表示用 xpath 方式查找元素。<code>xpath:</code>与<code>xpath=</code>效果一致，没有<code>xpat^</code>和<code>xpat$</code>语法。<br />
在元素中查找时，该方法支持完整的 xpath 语法，能使用 xpath 直接获取元素属性，selenium 不支持这种用法。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-24-1" name="__codelineno-24-1" href="#__codelineno-24-1"></a><span class="c1"># 查找 div 元素</span>
<a id="__codelineno-24-2" name="__codelineno-24-2" href="#__codelineno-24-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;xpath:.//div&#39;</span><span class="p">)</span>
<a id="__codelineno-24-3" name="__codelineno-24-3" href="#__codelineno-24-3"></a>
<a id="__codelineno-24-4" name="__codelineno-24-4" href="#__codelineno-24-4"></a><span class="c1"># 和上面一行一样，查找元素的后代时，// 前面的 . 可以省略</span>
<a id="__codelineno-24-5" name="__codelineno-24-5" href="#__codelineno-24-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;xpath://div&#39;</span><span class="p">)</span>
<a id="__codelineno-24-6" name="__codelineno-24-6" href="#__codelineno-24-6"></a>
<a id="__codelineno-24-7" name="__codelineno-24-7" href="#__codelineno-24-7"></a><span class="c1"># 获取 div 元素的 class 属性，返回字符串</span>
<a id="__codelineno-24-8" name="__codelineno-24-8" href="#__codelineno-24-8"></a><span class="n">txt</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;xpath://div/@class&#39;</span><span class="p">)</span>  
</code></pre></div>
<div class="admonition tip">
<p class="admonition-title">Tips</p>
<p>查找元素的后代时，selenium 原生代码要求 xpath 前面必须加<code>.</code>，否则会变成在全个页面中查找。作者觉得这个设计是画蛇添足，既然已经通过元素查找了，自然应该只查找这个元素内部的元素。所以，用</p>
</div>
<p>xpath 在元素下查找时，最前面<code>//</code>或<code>/</code>前面的<code>.</code>可以省略。</p>
<hr />
<h3 id="selenium-loc">📌 selenium 的 loc 元组</h3>
<p>查找方法能直接接收 selenium 原生定位元组进行查找，便于项目迁移。</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-25-1" name="__codelineno-25-1" href="#__codelineno-25-1"></a><span class="kn">from</span> <span class="nn">DrissionPage.common</span> <span class="kn">import</span> <span class="n">By</span>
<a id="__codelineno-25-2" name="__codelineno-25-2" href="#__codelineno-25-2"></a>
<a id="__codelineno-25-3" name="__codelineno-25-3" href="#__codelineno-25-3"></a><span class="c1"># 查找id为one的元素</span>
<a id="__codelineno-25-4" name="__codelineno-25-4" href="#__codelineno-25-4"></a><span class="n">loc1</span> <span class="o">=</span> <span class="p">(</span><span class="n">By</span><span class="o">.</span><span class="n">ID</span><span class="p">,</span> <span class="s1">&#39;one&#39;</span><span class="p">)</span>
<a id="__codelineno-25-5" name="__codelineno-25-5" href="#__codelineno-25-5"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="n">loc1</span><span class="p">)</span>
<a id="__codelineno-25-6" name="__codelineno-25-6" href="#__codelineno-25-6"></a>
<a id="__codelineno-25-7" name="__codelineno-25-7" href="#__codelineno-25-7"></a><span class="c1"># 按 xpath 查找</span>
<a id="__codelineno-25-8" name="__codelineno-25-8" href="#__codelineno-25-8"></a><span class="n">loc2</span> <span class="o">=</span> <span class="p">(</span><span class="n">By</span><span class="o">.</span><span class="n">XPATH</span><span class="p">,</span> <span class="s1">&#39;//p[@class=&quot;p_cls&quot;]&#39;</span><span class="p">)</span>
<a id="__codelineno-25-9" name="__codelineno-25-9" href="#__codelineno-25-9"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="n">loc2</span><span class="p">)</span>  
</code></pre></div>
<hr />
<h3 id="text_2">📌 <code>@@text()</code>的技巧</h3>
<p>值得一提的是，<code>text()</code>配合<code>@@</code>或<code>@|</code>能实现一种很便利的按查找方式。</p>
<p>网页种经常会出现元素和文本混排的情况，比如：</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-26-1" name="__codelineno-26-1" href="#__codelineno-26-1"></a><span class="p">&lt;</span><span class="nt">li</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;explore-categories__item&quot;</span><span class="p">&gt;</span>
<a id="__codelineno-26-2" name="__codelineno-26-2" href="#__codelineno-26-2"></a>  <span class="p">&lt;</span><span class="nt">a</span> <span class="na">href</span><span class="o">=</span><span class="s">&quot;/explore/new-tech&quot;</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;&quot;</span><span class="p">&gt;</span>
<a id="__codelineno-26-3" name="__codelineno-26-3" href="#__codelineno-26-3"></a>    <span class="p">&lt;</span><span class="nt">i</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;explore&quot;</span><span class="p">&gt;&lt;/</span><span class="nt">i</span><span class="p">&gt;</span>
<a id="__codelineno-26-4" name="__codelineno-26-4" href="#__codelineno-26-4"></a>    前沿技术
<a id="__codelineno-26-5" name="__codelineno-26-5" href="#__codelineno-26-5"></a>  <span class="p">&lt;/</span><span class="nt">a</span><span class="p">&gt;</span>
<a id="__codelineno-26-6" name="__codelineno-26-6" href="#__codelineno-26-6"></a><span class="p">&lt;/</span><span class="nt">li</span><span class="p">&gt;</span>
<a id="__codelineno-26-7" name="__codelineno-26-7" href="#__codelineno-26-7"></a><span class="p">&lt;</span><span class="nt">li</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;explore-categories__item&quot;</span><span class="p">&gt;</span>
<a id="__codelineno-26-8" name="__codelineno-26-8" href="#__codelineno-26-8"></a>  <span class="p">&lt;</span><span class="nt">a</span> <span class="na">href</span><span class="o">=</span><span class="s">&quot;/explore/program-develop&quot;</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;&quot;</span><span class="p">&gt;</span>
<a id="__codelineno-26-9" name="__codelineno-26-9" href="#__codelineno-26-9"></a>    <span class="p">&lt;</span><span class="nt">i</span> <span class="na">class</span><span class="o">=</span><span class="s">&quot;explore&quot;</span><span class="p">&gt;&lt;/</span><span class="nt">i</span><span class="p">&gt;</span>
<a id="__codelineno-26-10" name="__codelineno-26-10" href="#__codelineno-26-10"></a>    程序开发
<a id="__codelineno-26-11" name="__codelineno-26-11" href="#__codelineno-26-11"></a>  <span class="p">&lt;/</span><span class="nt">a</span><span class="p">&gt;</span>
<a id="__codelineno-26-12" name="__codelineno-26-12" href="#__codelineno-26-12"></a><span class="p">&lt;/</span><span class="nt">li</span><span class="p">&gt;</span>
</code></pre></div>
<p>示例中，如果要用文本获取<code>'前沿技术'</code>的<code>&lt;a&gt;</code>元素，可以这样写：</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-27-1" name="__codelineno-27-1" href="#__codelineno-27-1"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;text:前沿技术&#39;</span><span class="p">)</span>
<a id="__codelineno-27-2" name="__codelineno-27-2" href="#__codelineno-27-2"></a><span class="c1"># 或</span>
<a id="__codelineno-27-3" name="__codelineno-27-3" href="#__codelineno-27-3"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@ttext():前沿技术&#39;</span><span class="p">)</span>
</code></pre></div>
<p>这两种写法都能获取到包含直接文本的元素。</p>
<p>但如果要用文本获取<code>&lt;li&gt;</code>元素，就获取不到，因为文本不是<code>&lt;li&gt;</code>的直接内容。</p>
<p>我们可以这样写：</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-28-1" name="__codelineno-28-1" href="#__codelineno-28-1"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:li@@text():前沿技术&#39;</span><span class="p">)</span>
</code></pre></div>
<p><code>@@text()</code>与<code>@text()</code>不同之处在于，前者可以搜索整个元素内所有文本，而不仅仅是直接文本，因此能实现一些非常灵活的查找。</p>
<div class="admonition warning">
<p class="admonition-title">注意</p>
<p>须要注意的是，使用<code>@@</code>或<code>@|</code>时，<code>text()</code>不要作为唯一的查询条件，否则会定位到整个文档最高层的元素。  </p>
<p>❌ 错误做法：
<div class="highlight"><pre><span></span><code><a id="__codelineno-29-1" name="__codelineno-29-1" href="#__codelineno-29-1"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@@text():前沿技术&#39;</span><span class="p">)</span>
<a id="__codelineno-29-2" name="__codelineno-29-2" href="#__codelineno-29-2"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;@|text():前沿技术@|text():程序开发&#39;</span><span class="p">)</span>
</code></pre></div></p>
<p>⭕ 正确做法：
<div class="highlight"><pre><span></span><code><a id="__codelineno-30-1" name="__codelineno-30-1" href="#__codelineno-30-1"></a><span class="n">ele</span> <span class="o">=</span> <span class="n">page</span><span class="o">.</span><span class="n">ele</span><span class="p">(</span><span class="s1">&#39;tag:li@|text():前沿技术@|text():程序开发&#39;</span><span class="p">)</span>
</code></pre></div></p>
</div>
<hr />
<h2 id="_16">✅️️ 相对定位</h2>
<p>以下方法可以以某元素为基准，在 DOM 中按照条件获取其直接子节点、同级节点、祖先元素、文档前后节点。  </p>
<div class="admonition tip">
<p class="admonition-title">Tips</p>
<p>这里说的是“节点”，不是“元素”。因为相对定位可以获取除元素外的其它节点，包括文本、注释节点。</p>
</div>
<div class="admonition warning">
<p class="admonition-title">注意</p>
<p>如果元素在<code>&lt;iframe&gt;</code>中，相对定位不能超越<code>&lt;iframe&gt;</code>文档。</p>
</div>
<h3 id="_17">📌 获取父级元素</h3>
<p>🔸 <code>parent()</code></p>
<p>此方法获取当前元素某一级父元素，可指定筛选条件或层数。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>level_or_loc</code></td>
<td align="center"><code>int</code><br><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>1</code></td>
<td>第几级父元素，或定位符用于在祖先元素中查找</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>SessionElement</code></td>
<td>找到的元素对象</td>
</tr>
<tr>
<td align="center"><code>NoneElement</code></td>
<td>未获取到结果时返回<code>NoneElement</code></td>
</tr>
</tbody>
</table>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-31-1" name="__codelineno-31-1" href="#__codelineno-31-1"></a><span class="c1"># 获取 ele1 的第二层父元素</span>
<a id="__codelineno-31-2" name="__codelineno-31-2" href="#__codelineno-31-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">parent</span><span class="p">(</span><span class="mi">2</span><span class="p">)</span>
<a id="__codelineno-31-3" name="__codelineno-31-3" href="#__codelineno-31-3"></a>
<a id="__codelineno-31-4" name="__codelineno-31-4" href="#__codelineno-31-4"></a><span class="c1"># 获取 ele1 父元素中 id 为 id1 的元素</span>
<a id="__codelineno-31-5" name="__codelineno-31-5" href="#__codelineno-31-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">parent</span><span class="p">(</span><span class="s1">&#39;#id1&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="_18">📌 获取直接子节点</h3>
<p>🔸 <code>child()</code></p>
<p>此方法返回当前元素的一个直接子节点，可指定筛选条件和第几个。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>filter_loc</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>''</code></td>
<td>用于筛选节点的查询语法</td>
</tr>
<tr>
<td align="center"><code>index</code></td>
<td align="center"><code>int</code></td>
<td align="center"><code>1</code></td>
<td>查询结果中的第几个</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
<tr>
<td align="center"><code>ele_only</code></td>
<td align="center"><code>bool</code></td>
<td align="center"><code>True</code></td>
<td>是否只查找元素，为<code>False</code>时把文本、注释节点也纳入查找范围</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>SessionElement</code></td>
<td>找到的元素对象</td>
</tr>
<tr>
<td align="center"><code>str</code></td>
<td>获取非元素节点时返回字符串</td>
</tr>
<tr>
<td align="center"><code>NoneElement</code></td>
<td>未获取到结果时返回<code>NoneElement</code></td>
</tr>
</tbody>
</table>
<hr />
<p>🔸 <code>children()</code></p>
<p>此方法返回当前元素全部符合条件的直接子节点组成的列表，可用查询语法筛选。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>filter_loc</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>''</code></td>
<td>用于筛选节点的查询语法</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
<tr>
<td align="center"><code>ele_only</code></td>
<td align="center"><code>bool</code></td>
<td align="center"><code>True</code></td>
<td>是否只查找元素，为<code>False</code>时把文本、注释节点也纳入查找范围</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>List[SessionElement, str]</code></td>
<td>结果列表</td>
</tr>
</tbody>
</table>
<hr />
<h3 id="_19">📌 获取后面的同级节点</h3>
<p>🔸 <code>next()</code></p>
<p>此方法返回当前元素后面的某一个同级节点，可指定筛选条件和第几个。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>filter_loc</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>''</code></td>
<td>用于筛选节点的查询语法</td>
</tr>
<tr>
<td align="center"><code>index</code></td>
<td align="center"><code>int</code></td>
<td align="center"><code>1</code></td>
<td>查询结果中的第几个</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
<tr>
<td align="center"><code>ele_only</code></td>
<td align="center"><code>bool</code></td>
<td align="center"><code>True</code></td>
<td>是否只查找元素，为<code>False</code>时把文本、注释节点也纳入查找范围</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>SessionElement</code></td>
<td>找到的元素对象</td>
</tr>
<tr>
<td align="center"><code>str</code></td>
<td>获取非元素节点时返回字符串</td>
</tr>
<tr>
<td align="center"><code>NoneElement</code></td>
<td>未获取到结果时返回<code>NoneElement</code></td>
</tr>
</tbody>
</table>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-32-1" name="__codelineno-32-1" href="#__codelineno-32-1"></a><span class="c1"># 获取 ele1 后面第一个兄弟元素</span>
<a id="__codelineno-32-2" name="__codelineno-32-2" href="#__codelineno-32-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">next</span><span class="p">()</span>
<a id="__codelineno-32-3" name="__codelineno-32-3" href="#__codelineno-32-3"></a>
<a id="__codelineno-32-4" name="__codelineno-32-4" href="#__codelineno-32-4"></a><span class="c1"># 获取 ele1 后面第 3 个兄弟元素</span>
<a id="__codelineno-32-5" name="__codelineno-32-5" href="#__codelineno-32-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">next</span><span class="p">(</span><span class="mi">3</span><span class="p">)</span>
<a id="__codelineno-32-6" name="__codelineno-32-6" href="#__codelineno-32-6"></a>
<a id="__codelineno-32-7" name="__codelineno-32-7" href="#__codelineno-32-7"></a><span class="c1"># 获取 ele1 后面第 3 个 div 兄弟元素</span>
<a id="__codelineno-32-8" name="__codelineno-32-8" href="#__codelineno-32-8"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">next</span><span class="p">(</span><span class="s1">&#39;tag:div&#39;</span><span class="p">,</span> <span class="mi">3</span><span class="p">)</span>
<a id="__codelineno-32-9" name="__codelineno-32-9" href="#__codelineno-32-9"></a>
<a id="__codelineno-32-10" name="__codelineno-32-10" href="#__codelineno-32-10"></a><span class="c1"># 获取 ele1 后面第一个文本节点的文本</span>
<a id="__codelineno-32-11" name="__codelineno-32-11" href="#__codelineno-32-11"></a><span class="n">txt</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">next</span><span class="p">(</span><span class="s1">&#39;xpath:text()&#39;</span><span class="p">,</span> <span class="mi">1</span><span class="p">)</span>
</code></pre></div>
<hr />
<p>🔸 <code>nexts()</code></p>
<p>此方法返回当前元素后面全部符合条件的同级节点组成的列表，可用查询语法筛选。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>filter_loc</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>''</code></td>
<td>用于筛选节点的查询语法</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
<tr>
<td align="center"><code>ele_only</code></td>
<td align="center"><code>bool</code></td>
<td align="center"><code>True</code></td>
<td>是否只查找元素，为<code>False</code>时把文本、注释节点也纳入查找范围</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>List[SessionElement, str]</code></td>
<td>结果列表</td>
</tr>
</tbody>
</table>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-33-1" name="__codelineno-33-1" href="#__codelineno-33-1"></a><span class="c1"># 获取 ele1 后面所有兄弟元素</span>
<a id="__codelineno-33-2" name="__codelineno-33-2" href="#__codelineno-33-2"></a><span class="n">eles</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">nexts</span><span class="p">()</span>
<a id="__codelineno-33-3" name="__codelineno-33-3" href="#__codelineno-33-3"></a>
<a id="__codelineno-33-4" name="__codelineno-33-4" href="#__codelineno-33-4"></a><span class="c1"># 获取 ele1 后面所有 div 兄弟元素</span>
<a id="__codelineno-33-5" name="__codelineno-33-5" href="#__codelineno-33-5"></a><span class="n">divs</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">nexts</span><span class="p">(</span><span class="s1">&#39;tag:div&#39;</span><span class="p">)</span>
<a id="__codelineno-33-6" name="__codelineno-33-6" href="#__codelineno-33-6"></a>
<a id="__codelineno-33-7" name="__codelineno-33-7" href="#__codelineno-33-7"></a><span class="c1"># 获取 ele1 后面的所有文本节点</span>
<a id="__codelineno-33-8" name="__codelineno-33-8" href="#__codelineno-33-8"></a><span class="n">txts</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">nexts</span><span class="p">(</span><span class="s1">&#39;xpath:text()&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="_20">📌 获取前面的同级节点</h3>
<p>🔸 <code>prev()</code></p>
<p>此方法返回当前元素前面的某一个同级节点，可指定筛选条件和第几个。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>filter_loc</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>''</code></td>
<td>用于筛选节点的查询语法</td>
</tr>
<tr>
<td align="center"><code>index</code></td>
<td align="center"><code>int</code></td>
<td align="center"><code>1</code></td>
<td>查询结果中的第几个</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
<tr>
<td align="center"><code>ele_only</code></td>
<td align="center"><code>bool</code></td>
<td align="center"><code>True</code></td>
<td>是否只查找元素，为<code>False</code>时把文本、注释节点也纳入查找范围</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>SessionElement</code></td>
<td>找到的元素对象</td>
</tr>
<tr>
<td align="center"><code>str</code></td>
<td>获取非元素节点时返回字符串</td>
</tr>
<tr>
<td align="center"><code>NoneElement</code></td>
<td>未获取到结果时返回<code>NoneElement</code></td>
</tr>
</tbody>
</table>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-34-1" name="__codelineno-34-1" href="#__codelineno-34-1"></a><span class="c1"># 获取 ele1 前面第一个兄弟元素</span>
<a id="__codelineno-34-2" name="__codelineno-34-2" href="#__codelineno-34-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">prev</span><span class="p">()</span>
<a id="__codelineno-34-3" name="__codelineno-34-3" href="#__codelineno-34-3"></a>
<a id="__codelineno-34-4" name="__codelineno-34-4" href="#__codelineno-34-4"></a><span class="c1"># 获取 ele1 前面第 3 个兄弟元素</span>
<a id="__codelineno-34-5" name="__codelineno-34-5" href="#__codelineno-34-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">prev</span><span class="p">(</span><span class="mi">3</span><span class="p">)</span>
<a id="__codelineno-34-6" name="__codelineno-34-6" href="#__codelineno-34-6"></a>
<a id="__codelineno-34-7" name="__codelineno-34-7" href="#__codelineno-34-7"></a><span class="c1"># 获取 ele1 前面第 3 个 div 兄弟元素</span>
<a id="__codelineno-34-8" name="__codelineno-34-8" href="#__codelineno-34-8"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">prev</span><span class="p">(</span><span class="mi">3</span><span class="p">,</span> <span class="s1">&#39;tag:div&#39;</span><span class="p">)</span>
<a id="__codelineno-34-9" name="__codelineno-34-9" href="#__codelineno-34-9"></a>
<a id="__codelineno-34-10" name="__codelineno-34-10" href="#__codelineno-34-10"></a><span class="c1"># 获取 ele1 前面第一个文本节点的文本</span>
<a id="__codelineno-34-11" name="__codelineno-34-11" href="#__codelineno-34-11"></a><span class="n">txt</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">prev</span><span class="p">(</span><span class="mi">1</span><span class="p">,</span> <span class="s1">&#39;xpath:text()&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<p>🔸 <code>prevs()</code></p>
<p>此方法返回当前元素前面全部符合条件的同级节点组成的列表，可用查询语法筛选。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>filter_loc</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>''</code></td>
<td>用于筛选节点的查询语法</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
<tr>
<td align="center"><code>ele_only</code></td>
<td align="center"><code>bool</code></td>
<td align="center"><code>True</code></td>
<td>是否只查找元素，为<code>False</code>时把文本、注释节点也纳入查找范围</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>List[SessionElement, str]</code></td>
<td>结果列表</td>
</tr>
</tbody>
</table>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-35-1" name="__codelineno-35-1" href="#__codelineno-35-1"></a><span class="c1"># 获取 ele1 前面所有兄弟元素</span>
<a id="__codelineno-35-2" name="__codelineno-35-2" href="#__codelineno-35-2"></a><span class="n">eles</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">prevs</span><span class="p">()</span>
<a id="__codelineno-35-3" name="__codelineno-35-3" href="#__codelineno-35-3"></a>
<a id="__codelineno-35-4" name="__codelineno-35-4" href="#__codelineno-35-4"></a><span class="c1"># 获取 ele1 前面所有 div 兄弟元素</span>
<a id="__codelineno-35-5" name="__codelineno-35-5" href="#__codelineno-35-5"></a><span class="n">divs</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">prevs</span><span class="p">(</span><span class="s1">&#39;tag:div&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="_21">📌 在后面文档中查找节点</h3>
<p>🔸 <code>after()</code></p>
<p>此方法返回当前元素后面的某一个节点，可指定筛选条件和第几个。查找范围不限同级节点，而是整个 DOM 文档。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>filter_loc</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>''</code></td>
<td>用于筛选节点的查询语法</td>
</tr>
<tr>
<td align="center"><code>index</code></td>
<td align="center"><code>int</code></td>
<td align="center"><code>1</code></td>
<td>查询结果中的第几个</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
<tr>
<td align="center"><code>ele_only</code></td>
<td align="center"><code>bool</code></td>
<td align="center"><code>True</code></td>
<td>是否只查找元素，为<code>False</code>时把文本、注释节点也纳入查找范围</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>SessionElement</code></td>
<td>找到的元素对象</td>
</tr>
<tr>
<td align="center"><code>str</code></td>
<td>获取非元素节点时返回字符串</td>
</tr>
<tr>
<td align="center"><code>NoneElement</code></td>
<td>未获取到结果时返回<code>NoneElement</code></td>
</tr>
</tbody>
</table>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-36-1" name="__codelineno-36-1" href="#__codelineno-36-1"></a><span class="c1"># 获取 ele1 后面第 3 个元素</span>
<a id="__codelineno-36-2" name="__codelineno-36-2" href="#__codelineno-36-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">after</span><span class="p">(</span><span class="n">index</span><span class="o">=</span><span class="mi">3</span><span class="p">)</span>
<a id="__codelineno-36-3" name="__codelineno-36-3" href="#__codelineno-36-3"></a>
<a id="__codelineno-36-4" name="__codelineno-36-4" href="#__codelineno-36-4"></a><span class="c1"># 获取 ele1 后面第 3 个 div 元素</span>
<a id="__codelineno-36-5" name="__codelineno-36-5" href="#__codelineno-36-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">after</span><span class="p">(</span><span class="s1">&#39;tag:div&#39;</span><span class="p">,</span> <span class="mi">3</span><span class="p">)</span>
<a id="__codelineno-36-6" name="__codelineno-36-6" href="#__codelineno-36-6"></a>
<a id="__codelineno-36-7" name="__codelineno-36-7" href="#__codelineno-36-7"></a><span class="c1"># 获取 ele1 后面第一个文本节点的文本</span>
<a id="__codelineno-36-8" name="__codelineno-36-8" href="#__codelineno-36-8"></a><span class="n">txt</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">after</span><span class="p">(</span><span class="s1">&#39;xpath:text()&#39;</span><span class="p">,</span> <span class="mi">1</span><span class="p">)</span>
</code></pre></div>
<hr />
<p>🔸 <code>afters()</code></p>
<p>此方法返回当前元素后面符合条件的全部节点组成的列表，可用查询语法筛选。查找范围不限同级节点，而是整个 DOM 文档。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>filter_loc</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>''</code></td>
<td>用于筛选节点的查询语法</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
<tr>
<td align="center"><code>ele_only</code></td>
<td align="center"><code>bool</code></td>
<td align="center"><code>True</code></td>
<td>是否只查找元素，为<code>False</code>时把文本、注释节点也纳入查找范围</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>List[SessionElement, str]</code></td>
<td>结果列表</td>
</tr>
</tbody>
</table>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-37-1" name="__codelineno-37-1" href="#__codelineno-37-1"></a><span class="c1"># 获取 ele1 后所有元素</span>
<a id="__codelineno-37-2" name="__codelineno-37-2" href="#__codelineno-37-2"></a><span class="n">eles</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">afters</span><span class="p">()</span>
<a id="__codelineno-37-3" name="__codelineno-37-3" href="#__codelineno-37-3"></a>
<a id="__codelineno-37-4" name="__codelineno-37-4" href="#__codelineno-37-4"></a><span class="c1"># 获取 ele1 前面所有 div 元素</span>
<a id="__codelineno-37-5" name="__codelineno-37-5" href="#__codelineno-37-5"></a><span class="n">divs</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">afters</span><span class="p">(</span><span class="s1">&#39;tag:div&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h3 id="_22">📌 在前面文档中查找节点</h3>
<p>🔸 <code>before()</code></p>
<p>此方法返回当前元素前面的某一个符合条件的节点，可指定筛选条件和第几个。查找范围不限同级节点，而是整个 DOM 文档。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>filter_loc</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>''</code></td>
<td>用于筛选节点的查询语法</td>
</tr>
<tr>
<td align="center"><code>index</code></td>
<td align="center"><code>int</code></td>
<td align="center"><code>1</code></td>
<td>查询结果中的第几个</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
<tr>
<td align="center"><code>ele_only</code></td>
<td align="center"><code>bool</code></td>
<td align="center"><code>True</code></td>
<td>是否只查找元素，为<code>False</code>时把文本、注释节点也纳入查找范围</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>SessionElement</code></td>
<td>找到的元素对象</td>
</tr>
<tr>
<td align="center"><code>str</code></td>
<td>获取非元素节点时返回字符串</td>
</tr>
<tr>
<td align="center"><code>NoneElement</code></td>
<td>未获取到结果时返回<code>NoneElement</code></td>
</tr>
</tbody>
</table>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-38-1" name="__codelineno-38-1" href="#__codelineno-38-1"></a><span class="c1"># 获取 ele1 前面第 3 个元素</span>
<a id="__codelineno-38-2" name="__codelineno-38-2" href="#__codelineno-38-2"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">before</span><span class="p">(</span><span class="mi">3</span><span class="p">)</span>
<a id="__codelineno-38-3" name="__codelineno-38-3" href="#__codelineno-38-3"></a>
<a id="__codelineno-38-4" name="__codelineno-38-4" href="#__codelineno-38-4"></a><span class="c1"># 获取 ele1 前面第 3 个 div 元素</span>
<a id="__codelineno-38-5" name="__codelineno-38-5" href="#__codelineno-38-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">before</span><span class="p">(</span><span class="s1">&#39;tag:div&#39;</span><span class="p">,</span> <span class="mi">3</span><span class="p">)</span>
<a id="__codelineno-38-6" name="__codelineno-38-6" href="#__codelineno-38-6"></a>
<a id="__codelineno-38-7" name="__codelineno-38-7" href="#__codelineno-38-7"></a><span class="c1"># 获取 ele1 前面第一个文本节点的文本</span>
<a id="__codelineno-38-8" name="__codelineno-38-8" href="#__codelineno-38-8"></a><span class="n">txt</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">before</span><span class="p">(</span><span class="s1">&#39;xpath:text()&#39;</span><span class="p">,</span> <span class="mi">1</span><span class="p">)</span>
</code></pre></div>
<hr />
<p>🔸 <code>befores()</code></p>
<p>此方法返回当前元素前面全部符合条件的节点组成的列表，可用查询语法筛选。查找范围不限同级节点，而是整个 DOM 文档。</p>
<table>
<thead>
<tr>
<th align="center">参数名称</th>
<th align="center">类型</th>
<th align="center">默认值</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>filter_loc</code></td>
<td align="center"><code>str</code><br><code>Tuple[str, str]</code></td>
<td align="center"><code>''</code></td>
<td>用于筛选节点的查询语法</td>
</tr>
<tr>
<td align="center"><code>timeout</code></td>
<td align="center"><code>float</code></td>
<td align="center"><code>None</code></td>
<td>无实际作用</td>
</tr>
<tr>
<td align="center"><code>ele_only</code></td>
<td align="center"><code>bool</code></td>
<td align="center"><code>True</code></td>
<td>是否只查找元素，为<code>False</code>时把文本、注释节点也纳入查找范围</td>
</tr>
</tbody>
</table>
<table>
<thead>
<tr>
<th align="center">返回类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>List[SessionElement, str]</code></td>
<td>结果列表</td>
</tr>
</tbody>
</table>
<p><strong>示例：</strong></p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-39-1" name="__codelineno-39-1" href="#__codelineno-39-1"></a><span class="c1"># 获取 ele1 前面所有元素</span>
<a id="__codelineno-39-2" name="__codelineno-39-2" href="#__codelineno-39-2"></a><span class="n">eles</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">befores</span><span class="p">()</span>
<a id="__codelineno-39-3" name="__codelineno-39-3" href="#__codelineno-39-3"></a>
<a id="__codelineno-39-4" name="__codelineno-39-4" href="#__codelineno-39-4"></a><span class="c1"># 获取 ele1 前面所有 div 元素</span>
<a id="__codelineno-39-5" name="__codelineno-39-5" href="#__codelineno-39-5"></a><span class="n">divs</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">befores</span><span class="p">(</span><span class="s1">&#39;tag:div&#39;</span><span class="p">)</span>
</code></pre></div>
<hr />
<h2 id="_23">✅️️ 简化写法</h2>
<p>为进一步精简代码，对语法进行了精简</p>
<ul>
<li>定位语法都有其简化形式。</li>
<li>页面和元素对象都实现了<code>__call__()</code>方法，可直接调用。</li>
<li>所有查找方法都支持链式操作</li>
</ul>
<p>示例：</p>
<div class="highlight"><pre><span></span><code><a id="__codelineno-40-1" name="__codelineno-40-1" href="#__codelineno-40-1"></a><span class="c1"># 定位到页面中 id 为 table_id 的元素，然后获取它的所有 tr 元素</span>
<a id="__codelineno-40-2" name="__codelineno-40-2" href="#__codelineno-40-2"></a><span class="n">eles</span> <span class="o">=</span> <span class="n">page</span><span class="p">(</span><span class="s1">&#39;#table_id&#39;</span><span class="p">)</span><span class="o">.</span><span class="n">eles</span><span class="p">(</span><span class="s1">&#39;t:tr&#39;</span><span class="p">)</span>
<a id="__codelineno-40-3" name="__codelineno-40-3" href="#__codelineno-40-3"></a>
<a id="__codelineno-40-4" name="__codelineno-40-4" href="#__codelineno-40-4"></a><span class="c1"># 定位到 class 为 cls 的元素，然后在它里面查找文本为 text 的元素</span>
<a id="__codelineno-40-5" name="__codelineno-40-5" href="#__codelineno-40-5"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="p">(</span><span class="s1">&#39;.cls1&#39;</span><span class="p">)(</span><span class="s1">&#39;tx=text&#39;</span><span class="p">)</span>
<a id="__codelineno-40-6" name="__codelineno-40-6" href="#__codelineno-40-6"></a>
<a id="__codelineno-40-7" name="__codelineno-40-7" href="#__codelineno-40-7"></a><span class="c1"># 获取 ele1 的 shadow_root 元素，再在里面查找 class 属性为 cls 的元素</span>
<a id="__codelineno-40-8" name="__codelineno-40-8" href="#__codelineno-40-8"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="o">.</span><span class="n">sr</span><span class="p">(</span><span class="s1">&#39;.cls&#39;</span><span class="p">)</span>
<a id="__codelineno-40-9" name="__codelineno-40-9" href="#__codelineno-40-9"></a>
<a id="__codelineno-40-10" name="__codelineno-40-10" href="#__codelineno-40-10"></a><span class="c1"># 按xpath 查找元素</span>
<a id="__codelineno-40-11" name="__codelineno-40-11" href="#__codelineno-40-11"></a><span class="n">ele2</span> <span class="o">=</span> <span class="n">ele1</span><span class="p">(</span><span class="s1">&#39;x://div[@class=&quot;ele_class&quot;]&#39;</span><span class="p">)</span>  
</code></pre></div>
<p>简化写法对应列表</p>
<table>
<thead>
<tr>
<th align="center">原写法</th>
<th align="center">简化写法</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center"><code>text</code></td>
<td align="center"><code>tx</code></td>
</tr>
<tr>
<td align="center"><code>text()</code></td>
<td align="center"><code>tx()</code></td>
</tr>
<tr>
<td align="center"><code>tag</code></td>
<td align="center"><code>t</code></td>
</tr>
<tr>
<td align="center"><code>xpath</code></td>
<td align="center"><code>x</code></td>
</tr>
<tr>
<td align="center"><code>css</code></td>
<td align="center"><code>c</code></td>
</tr>
</tbody>
</table>





                
              </article>
            </div>
          
          
        </div>
        
          <button type="button" class="md-top md-icon" data-md-component="top" hidden>
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13 20h-2V8l-5.5 5.5-1.42-1.42L12 4.16l7.92 7.92-1.42 1.42L13 8v12Z"/></svg>
            Back to top
          </button>
        
      </main>
      
        <footer class="md-footer">
  
    
      
      <nav class="md-footer__inner md-grid" aria-label="Footer" >
        
          
          <a href="../get_page_info/" class="md-footer__link md-footer__link--prev" aria-label="Previous: ✉️ 获取网页信息" rel="prev">
            <div class="md-footer__button md-icon">
              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11h12Z"/></svg>
            </div>
            <div class="md-footer__title">
              <span class="md-footer__direction">
                Previous
              </span>
              <div class="md-ellipsis">
                ✉️ 获取网页信息
              </div>
            </div>
          </a>
        
        
          
          <a href="../get_element_info/" class="md-footer__link md-footer__link--next" aria-label="Next: ✉️ 获取元素信息" rel="next">
            <div class="md-footer__title">
              <span class="md-footer__direction">
                Next
              </span>
              <div class="md-ellipsis">
                ✉️ 获取元素信息
              </div>
            </div>
            <div class="md-footer__button md-icon">
              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4 11v2h12l-5.5 5.5 1.42 1.42L19.84 12l-7.92-7.92L10.5 5.5 16 11H4Z"/></svg>
            </div>
          </a>
        
      </nav>
    
  
  <div class="md-footer-meta md-typeset">
    <div class="md-footer-meta__inner md-grid">
      <div class="md-copyright">
  
  
    Made with
    <a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
      Material for MkDocs
    </a>
  
</div>
      
    </div>
  </div>
</footer>
      
    </div>
    <div class="md-dialog" data-md-component="dialog">
      <div class="md-dialog__inner md-typeset"></div>
    </div>
    
    <script id="__config" type="application/json">{"base": "../..", "features": ["navigation.top", "navigation.tracking", "toc.follow", "content.code.copy", "navigation.tabs", "navigation.tabs.sticky", "header.autohide", "navigation.footer"], "search": "../../assets/javascripts/workers/search.208ed371.min.js", "translations": {"clipboard.copied": "Copied to clipboard", "clipboard.copy": "Copy to clipboard", "search.result.more.one": "1 more on this page", "search.result.more.other": "# more on this page", "search.result.none": "No matching documents", "search.result.one": "1 matching document", "search.result.other": "# matching documents", "search.result.placeholder": "Type to start searching", "search.result.term.missing": "Missing", "select.version": "Select version"}}</script>
    
    
      <script src="../../assets/javascripts/bundle.a51614de.min.js"></script>
      
        
          <script src="../../js/open_in_new_tab.js"></script>
        
      
    
  </body>
</html>